Javascript fabric js-生成图像中的对象与画布中的对象具有不同的位置

我正在尝试使用Fabric js生成一些带有文本的图像。但由于某些原因，生成的图像中文本的位置与画布中的位置不一致。以下是画布中的图像：

fabric.Image.fromURL(image_source, function(oImg) {
      oImg.width = canvas.width;
      oImg.height = canvas.height;
      canvas.add(oImg);
});

但生成的图像如下所示：

我给画布的大小是881x640，它与我给图像的输出大小相同

下面是我目前在代码中所做的

我正在从URL将背景图像添加到画布中。但在此之前，我首先调整图像大小，使其与画布大小相同：

fabric.Image.fromURL(image_source, function(oImg) {
      oImg.width = canvas.width;
      oImg.height = canvas.height;
      canvas.add(oImg);
});

然后我将

canvas.toJSON（）

调用的字符串化结果发送到节点js服务器，以使用AJAX生成图像：

$.post('http://host:1212', {'canvas': JSON.stringify(canvas.toJSON())});

在服务器端，我加载对象并创建图像：

var out = fs.createWriteStream(__dirname + '/uploads/' + file_name);

var body = '';
request.on('data', function(data){
    body += data;
});

request.on('end', function(){

  var request_params = qs.parse(body);

  //set to same size as the canvas on the client side
  var canvas = fabric.createCanvasForNode(881, 640);

  canvas.loadFromJSON(request_params.canvas, function(){
    canvas.renderAll();

    var stream = canvas.createPNGStream();
    stream.on('data', function(chunk){
      out.write(chunk);
    });

    stream.on('end', function(){
      //close filestream
      out.end();
  });
});

---

你知道我哪里出错了吗？

也许你应该尝试添加canvas.calcOffset（）：

---

我也有同样的问题。原来fabric.js中有一个用于在节点上渲染的bug。请在此处阅读：

要解决此问题，请查看节点\u modules/fabric/dist/fabric.js-第19376行

_getLeftOffset: function() {
  // if (fabric.isLikelyNode) {
  //   return 0;
  // }
  return -this.width / 2;
}

就像上面一样，注释掉if（fabcir.isLikelyNode）

---

这为我解决了问题。

您发布的图像具有不同的高度，这是故意的吗？第一个图像是来自浏览器画布的屏幕截图，第二个是生成的图像。它们的高度不一样的原因是因为我在截图时做得不好。你对这些文本使用自定义字体吗@KyokasuigetsuIt似乎与这里描述的问题相同不，我没有使用自定义字体。这些字体是我的机器上可用的默认字体：helvetica和courier。