微信小程序之画布(canvas)转化出来的图片模糊问题

将canvas大小设为(1200*800)，使用css将canvas缩放到适应屏幕大小。

这在开发工具的模拟器中是没有问题的，然而在真机测试的时候是无效的，不管用的是transform还是zoom。

本质上就是生成一个更大的图片，因为手机的屏幕设备的像素比现在一般都是超过2的。实际上我们只需要在使用wx.canvasToTempFilePath的时候，设置参数destWidth和destHeight(输出的宽度和高度)为width和height的2倍以上即可。

context.draw(true, setTimeout(function() {
      //将生成好的图片保存到本地，需要延迟一会，绘制期间耗时
      wx.canvasToTempFilePath({
        x: 0,
        y: 0,
        width: 670,
        height: 959,
        destWidth: 2010,
        destHeight: 2877,
        canvasId: 'mycanvas',
        success: function(res) {
          var tempFilePath = res.tempFilePath;
          that.setData({
            imagePath: tempFilePath,
            canvasHidden: true
          });
        },
        fail: function(res) {
          console.log(res);
        }
      });
    }, 200));