fabricjs - Fabric.js 中文本始终显示在图像下方

Question

我遇到以下问题。我一直在一个项目中使用 Fabric.js，发现它很容易使用。但是我有以下问题，我似乎无法解决。我可能错过了显而易见的事情，但现在是寻求帮助的时候了。

我无法在加载的图像上显示文本层。这是代码:

<canvas id="c" height=600 width=800></canvas>

var canvas = new fabric.StaticCanvas('c'); 

fabric.Image.fromURL('http://mozorg.cdn.mozilla.net/media/img/products/badge-   firefoxos.jpg?2013-06', function(img) {
    var imgX = img.set({
      top: 0,
      left: 0,
    });

    canvas.add(imgX);
  });

var text   = new fabric.Text("This text always gets burried", {
    top        : 0,
    left       : 0,
    fontSize   : 50,
    fontFamily : 'Delicious_500'
  });
  canvas.add(text);

canvas.BringToFront(text);
 canvas.renderAll();

我还创建了一个 fiddle :http://jsfiddle.net/NkqWL/9/

非常感谢任何建议。

Answer 1

我已经更新了你的 fiddle

fiddle 链接:- Click Here

使用 canvas.sendToBack(imgX); 将您的图像发送回后台

fabric.Image.fromURL('http://mozorg.cdn.mozilla.net/media/img/products/badge-firefoxos.jpg?2013-06', function(img) {
        var imgX = img.set({
          top: 0,
          left: 0,
        });

        canvas.add(imgX);
           canvas.sendToBack(imgX);
      });