一、canvas绘图接口drawImage
,开发时遇到的问题
在使用
drawImage
绘图时,可以直接使用项目路径下的图片以及通过手机选择或拍摄的图片。如果使用网络图片,需要对网络图片进行一些处理。
1. 项目文件路径下的图片
ctx.drawImage("../images/demo.png", 0, 0, 150, 100)
2. 手机相册里的图片或者使用手机拍摄的图片
wx.chooseImage({
success: function(res){
ctx.drawImage(res.tempFilePaths[0], 0, 0, 150, 100)
ctx.draw()
}
})
3. 在canvas
上绘制网络图片
wx.getImageInfo({
src: 'http://weixin.wedei.com/yx/LQXimages/images/scimgbg.jpg',
success:function(res){
console.log("--------");
console.log(res.path); //现在可以使用`res.path`将网络图片绘制到自`canvas`上了
}
})