h5 蓝牙打印机 打印 图片_微信小程序操作蓝牙打印机3图片处理原理

微信小程序在页面上加载图片

图片207.bmp,尺寸100x46

首先定义一个300x300的画布

<canvas style="width: 300px; height: 300px;" canvas-id="firstCanvas">canvas>

JS代码

定义公共变量

var nw = 100;

var nh = 46;

onReady事件加载图片

var ctx = wx.createCanvasContext('firstCanvas')        

ctx.drawImage('../../images/207.bmp', 0, 0, nw, nh)

ctx.draw(true, () => {

})

效果如下图

微信小程序有个API

wx.canvasGetImageData 可以获取图像数据

图像数据其实是一个一维的数组，数组的大小是图像的长x宽x4计算得到的.

我们知道图像是由一个个像素组成的,一个彩色的点由RGB三色组成的。在微信小程序中再加一个alpha

值，也就是透明值。也就是说，每四点代表一个值