Canvas 使用缓存时未使用KonvaJS在画布上绘制大型图像

我使用konvajs和vue konva在矩形区域上定位图像。我需要缓存此图像，以便对其应用自定义过滤器

此图像由用户上传，其尺寸可能相当大（示例中来自设备摄像头），并且设备可能是资源有限的智能手机

对于小图像，一切正常，但当用户在移动设备上选择大图像（示例中为2500x2500）时，图像将首先渲染，并在图像节点上调用

cache（）

方法时消失

这似乎取决于设备：我的笔记本电脑上的一切都很好，但我的智能手机（都是高端设备）上的一切都很好，都是最新版本的谷歌Chrome。我设法在笔记本电脑上用更大的图像（~6000x6000）重现了这个问题

我真的不知道它是否与Konva有关，也不知道我是否在使用大文件时遇到了浏览器限制（这可以解释这取决于设备）。如果是这样，请提供任何建议/解决方法

最后但并非最不重要的一点是，我需要导出画布以便稍后打印（300dpi分辨率，最终图像的dth必须在2300px左右），这样我就不能减少太多图像大小

---

您可以使用浏览器限制的。

进行复制。有时，他们可能无法绘制太大的图像。同样在HDPI设备（几乎所有现代屏幕）中，

Konva

正试图通过增加缓存大小来提高缓存质量。这对于任何向量形状（如矩形、圆等）都有意义。但对于一个形象来说，这并没有多大帮助

因此，您可以使用以下方法减小缓存的图像大小：

image.cache（{pixelRatio:1}）

---

使用

pixelRatio=1

时，缓存画布的大小将与图像大小完全相同。你可以试着减少更多。像

像素比率=0.5

。如果您有一张较大的图像，并将其缩放到较小的尺寸，用户可能看不到质量降低的差异。

谢谢您指出这一点。这并不能解决所有问题，但它帮助我更好地理解这个问题！在使用之前，我会尝试将图像缩小一点。