canvas如何导入缩放的图片,让它自适应.
时间：2019-05-05 来源：小程序工厂
我弄了个图片进去.1080*1920的,但是我的canvas没那么大.
什么办法能缩放图片让他全部到canvas显示呢?
var context = wx.createCanvasContext('mycanvas')
context.drawImage(this.data.fromdata.basepic, 0, 0,1080, 1980);
context.scale(1/2, 1/2);
完全不生效啊
要的这个效果.
结果的效果是这样了.
本文来自微信小程序开发者论坛 微信小程序工厂 http://www.xcxgc.com 转载请保留。
本文网址：http://www.91bianli.com/weixinxiaochengxu/57974.html
什么办法能缩放图片让他全部到canvas显示呢?
var context = wx.createCanvasContext('mycanvas')
context.drawImage(this.data.fromdata.basepic, 0, 0,1080, 1980);
context.scale(1/2, 1/2);
完全不生效啊
要的这个效果.
结果的效果是这样了.
本文来自微信小程序开发者论坛 微信小程序工厂 http://www.xcxgc.com 转载请保留。
微信小程序开发者回答：
小***：
drawImage用的是px,
canvas我用的是rpx导致出现的显示不全。解决办法：
var res = wx.getSystemInfoSync();
var radio = res.screenWidth/750;//rpx和px的转换比
ctx.drawImage('../../assets/card.jpeg', 0, 0, that.data.width * radio, that.data.height * radio);//图片要乘屏幕像素比；
本文网址：http://www.91bianli.com/weixinxiaochengxu/57974.html
相关文章
- phone不支持canvas的scale为负数##微信小程序教程
- 51微信小程序微信小程序canvas画布iphone真机无法设置s
- 如何解读getUserInfo接口？
- open-data 数据如何放到image src属性里面+微信小程序
- 小游戏Canvas 2D接口不齐和功能问题.
- 51微信小程序Canvas 2D 的clip()函数有非常严重的性能问
- 小游戏canvas接口不齐全-微信小程序开发
- cocos creator 导入小游戏无法识别入口文件？？？
- sharedCanvas 实现图片裁切-微信小程序开发
- 如何增加nmp库呢&微信小程序开发
- 微信卡包设置卡券的跳转按钮，这种样式如何设
- 公众号如何群发微信小程序卡片&微信小程序开发
- 微信小程序中如何获取终端IP？因为统一支付接口需要
- 公众号更名
- scroll-view 如何做上下刷刷新
- 提高用户体验，我如何优雅的处理用户信息呢？
- canvasToTempFilePath截图图片的时候图片模糊 已经是
- 如何禁止视频video的左滑和右滑事件，只有进度条
- 微信小程序提及好友怎么做
- 51微信小程序微信小程序如何打开微信公众号文章？
- canvas 问题#微信小程序开发
- 微信小程序canvasContext.drawImage大图压缩成小图图片失真
- wxml 里 使用了<canvas 后 直接崩溃
- 51微信小程序wx.canvasToTempFilePath保存到本地，工具好的
