Question

我们正在使用FabricJS编辑器，我们正在加载SVG模板。我们还编辑一些文本，更改对象的位置并保存为SVG。这里的一切都很好。

但现在我们需要在一个SVG中加载非常大的图像。 SVG中的每个图像都将具有高分辨率，因为它用于印刷行业。在这里，我们无法加载SVG，因为嵌入的图像非常大。

我们想到了一种解决方案，在加载到编辑器之前以及在编辑后将原始图像作为输出重新调整之前重新调整这些图像的大小。但这也没有成功，因为当我们调整大小时，我们面临着在SVG中定位对象的一些问题

有人可以建议解决此问题的方法

Answer 1

我也一直在使用fabric.js和你的一样。作为在画布上显示时定位图像的问题。你可以这样定位。

$('#canvas').attr('width',img_data.width).attr('height',img_data.height);
var canvas = new fabric.Canvas('canvas');
var imgElement = document.getElementById('myimg');
var CanImg = new fabric.Image(imgElement, {
    left: -1 * img_data.x,
    top : -1 * img_data.y,
});
CanImg.selectable = false;
canvas.add(CanImg);

使用“向左”和“向上”可以设置图像的x和y坐标的位置。它也适用于大图像。您可能会卡在画布上显示大图像。但就定位图像问题而言，这将起作用。

祝你好运。

在FabricJs上的svg中加载大图像时出现问题

1 个答案: