作物上的Jcrop + Canvas透明图像问题

Posted 2023-02-25

【中文标题】作物上的Jcrop + Canvas透明图像问题

【英文标题】：Jcrop + Canvas Transparent Image Issue On Crop

【发布时间】：2013-03-14 18:41:25

【问题描述】：

目前我们在我们的项目中仅使用 javascript + jQuery，我们正在尝试将最终图像从 jCrop 转换为 base64，以便在 html 画布的帮助下传递给第三方服务。到目前为止，我们已经弄清楚了一切，只需要一件。当用户将透明 PNG 上传到 jCrop 时，我们会裁剪图像，在画布预览中，当移动或展开 jCrop 选择时，图像的透明部分会变得模糊。

您可以在此处查看问题示例，您可以看到当我在 jCrop 中拖动选择时，图像的透明部分严重模糊：http://i46.tinypic.com/23jl946.png

我在 jCrop 中使用了一些不透明度设置，例如：

bgColor: 'transparent'

并为画布尝试了 globalAlpha，但这些似乎不起作用。

var c           = canvas.getContext('2d');
c.globalAlpha   = 0;

有什么想法吗？

【参考方案1】：

其实就是用画布的 clearRect 来解决的。

context.clearRect(0, 0, canvas.width, canvas.height);