小程序 Canvas绘图不同尺寸设备 UI兼容的两个解决方案

最近做的一个需求，遇到一个问题，小程序绘图目前只支持 px单位，设计图一般是以 iphone6为基准设计，如果严格 iphone6的尺寸进行代码编写，放在其他尺寸的设备上，肯定是不行的，所以需要按照设备进行等比例兼容，这里给出两个解决方案

先假设一个需求，下面是最终实现的效果(以 iphone6为基准)，下面就以此为目标进行展开

整个页面被 canvas组件覆盖(在 iphone6下宽高为 375x603)，中间偏蓝色的是一张图片，图片上有一行字 flexible canvas

类 rem

等比例缩放单位的解决方案，也就是以一个尺寸为基准，例如 iphone 6，然后其他设备按照这个标准，在保证宽度铺满设备的前提下，进行等比例缩放

绘制的代码很简单：

const ctx = wx.createCanvasContext('shareCard')
ctx.drawImage('../58a.png', this.remSize(85),