关于小程序画布展示图片模糊问题

关于小程序画布展示图片模糊问题
基于movable-area中canvas画布展示图片并缩放操作中的图片模糊问题
在移动端中常用到图片缩放的技术，在小程序中也不例外，微信小程序继续缩放功能封装了canvas，并开发了movable-area这个组件，众所周知微信小程序是基于Vue进行开发的，而Vue在处理代码的重用上也处理到了极致，模板（Component）和组件(template)是Vue的一大特色。
movable-area就是小程序封装的一个组件，该组件通过设置scale-min、scale-max、animation等属性来设置画布属性，通过@scale、draw等方法监听画布触摸响应。
由于在将图片置于画布上时需要设置初始宽高，此时页面加载图片后，其实图片是经过宽高缩放后展示的，而且在缩放过程中，图片也是在页面上经过不断地处理，这一系列的问题就可能导致用户在使用过程发现图片并不清晰的原因。
小程序针对这个问题也是给出了解决方案，在调用canvasToTempFilePath方法时，将destWidth及destHeight属性分别设置为其width750/ wx.getSystemInfoSync().windowWidth, height750，这样在加载图片的过程中就会大大减少页面缩放中造成的模糊问题。
因为手机的屏幕设备的像素比现在一般都是超过2的。实际上我们只需要在使用wx.canvasToTempFilePath的时候，设置参数destWidth和destHeight(输出的宽度和高度)为width和height的2倍以上即可。