小程序canvas导出图片,高清屏(ios)模糊
发布于 4 年前 作者 yan84 10873 次浏览 来自 问答

h5中可以解决这个问题,但是在微信小程序中尝试了几种方法都没解决这个问题,方法如下:

1、canvas的宽高扩大2倍,然后通过css进行控制scale、zoom,来缩放

    

    结果:开发工具中可以实现,真机不行,缩放样式不执行

2、创建两个canvas,canvas1正常宽度(展示图片),canvas2宽高扩大2倍(导出图片);

    

    1)canvas2通过z-index改变层级,使得canvas2在canvas1下层

        结果:开发工具中可以实现,真机不行

    

    2)改变canvas2的opacity值

        结果:开发工具中可以实现,真机不行

目前只想到这几种方法,求助大神们解决。

希望微信小程序能解决这个问题

9 回复

同问这个问题,小程序的 canvas 导出图片模糊问题尝试了几种方法都没有解决。楼主如果解决烦请告知!

那文字也模糊怎么理解?@tesths

明明微信有内置的方法处理,又不开放,徒增开发者困扰。

我只是说就 canvas 处理图片,因为想在客户端直接处理图片不想上传服务器了。

一样的问题下的回答

上面这个问题,回答者提到 把输出宽高设置为 canvas宽高*设备像素比,试了此方法,可生成清晰的图片

 canvas宽高*设备像素比到6再往上就不好用了,也没有清晰多少

主要是 canvas 在模拟器都正常一到整机就不正常。想不联网处理图片存在很大难度,现在看来必须服务器端处理了。

canvas draw image 的时候图片无法将图片按比例正好显示在 canvas 里,所以 canvas 在 draw image 的时候图片本身像素就降低了,再导出的话虽然可以但是实际上图片在放到 canvas 的时候已经有损了。

Canvas有直接导出到相册的方法吗?现在只能是使用PreviewImage来间接实现。

回到顶部