嵌套CANVAS元素

Question

是否有可能在另一个元素中有元素？我知道我可以将它们分层，但是这是可能的 -

<canvas id="parent"> 
    <canvas id="child"></canvas> 
</canvas> 

我试过了，但似乎没有工作。

Answer 1

canvas specification不允许这样做。画布元素可以用在嵌入式内容上下文中;嵌套一个画布元素将其置于一个后备内容上下文中，这是不受支持的。

Answer 2

如果要单独处理背景和前景，可以使用两个画布，并使用css将另一个放在另一个之上。

<canvas id="bg" width="640" height="480" style="position: absolute; z-index: 0"> 
</canvas> 
<canvas id="fg" width="640" height="480" style="position: absolute; z-index: 1"> 
</canvas> 

其实这是提高画布性能的提示之一。来源：HTML5 Rocks

Answer 3

您可能需要考虑通过转换到画布上的各种位置来进行虚拟嵌入。

这里有这样的例子：

http://marketimpacts.com/storage/9781118385357%20ls0702%20Complex%20Objects.htm

它是：

http://www.amazon.com/HTML5-Canvas-For-Dummies-Cowan/dp/1118385357/ref=cm_cmu_up_thanks_hdr