html canvas zindex

如何更改画布内元素的zindex？html canvas zindex

示例代码：

fabric.Image.fromURL('http://nocookie.net/bw.jpg', function(image) { 
    image.set('left', 200).set('top', 250); 
    canvas.add(image); 
}); 


var helloWorld = new fabric.Text('Hello world!', { 
    left: 0, 
    top: 0, 
    fontfamily: 'delicious_500', 
    zindex: 10 
}); 

canvas.add(helloWorld);

使用fabric.js库。

以供将来参考：

fabric.Element.html＃bringForward

来源

2011-02-17 Mark

您可以发布一个例子吗？ [你真的在画布上有元素吗？]（http://www.youtube.com/watch?v=Guwvwp0uSU8） – sdleihssirhc

@sdleihssirhc发布了一些示例代码来展示我的意思。我希望能够设置图像上方的文字。 – Mark

哇，[fabric.js文档]（http://kangax.github.com/fabric.js/docs/）是没用的。 – sdleihssirhc

我不能让党的事情，在所有的工作，但这里是我的猜测，发生了什么事：

Fabric要求该图像的URL。当图像被返回时，结构已经被赋予回调方法，所以当它等待时，它将转到下一个任务
结构创建Text对象并将其添加到画布。
最后，它注意到图像已经加载（您提供的具体示例实际上是404'd），并将其传递给回调方法。

由于图像文本后添加到画布，我假设面料的作用就像画布通常会：这是后来添加的东西是对的事情，已经在那里顶部排出。 ...即使你给了文本一个Z指数。

请记住，我无法让它工作，只是放弃了。所以完全有可能我完全错了。如果是这样，我有另一种理论：

你确定zindex是正确的属性？如果你是，那么请尝试将其在图像上，还有：

image.set('left', 200).set('top', 250).set('zindex', 5);

如果你不肯定，那么......你去那里。

来源

2011-02-17 06:17:00 sdleihssirhc

zindex只是一个随机猜测。尝试zIndex以及无济于事。不知道什么是房地产。我也尝试设置图像。感谢您的帮助+1，我试着在谷歌上查找canvas API，但没有去。 :( – Mark

@mark我的第一个想法是什么？尝试在图像之前声明'helloWorld'，然后在添加图像后将其添加到画布（即，移动'canvas.add（helloWorld）'，这样它是*里面的*图像功能。） – sdleihssirhc

这样做的伎俩！谢谢！对不起，我不明白你第一次说这是什么意思。：P不幸的是仍然没有想出canvas zindex的api命令，所以问题标题目前有点误导。但它解决了我目前的问题，非常感谢 – Mark

由于1.1.4 fabric.js版本zIndex的操作的新方法可用：

canvas.moveTo(object, index); 
object.moveTo(index);

我希望这是你想要什么：

http://jsfiddle.net/Kienz/RRv3g/

来源

2013-11-26 03:23:31 John

html canvas zindex

回答

相关问题