HTML5画布 - 并排放置2个画布对象

Question

我知道你可以将画布叠加在彼此之上，就像你在Photoshop中制作图像一样，但是你能够将画布对象放在彼此的上方或下方或者并排吗？

我想要绘制一个图表，允许您选择一个空格，根据您选择的颜色，它将根据该选项更改块。

这是我的想法： 画布＃1 - 绘制方格纸 画布＃2 - 画布右侧＃1 - 有4种颜色选择的标签。我会弄清楚这些的x-y来根据彩色图像抓取颜色。画布1块颜色将反映这种选择。

这是实现此实施的好方法吗？

Answer 1

是的，您可以将画布放在上方，下方并排放在一起。 canvas是一个HTML元素，可以像使用CSS一样定位。

我可能会尽量避免在你的颜色选择标签上使用画布，除非出于某种原因你没有提到它是绝对必要的。如果您使用标准DOM元素，则可以直接绑定到click事件，而不必在画布中找出相对于图形的鼠标位置。

以下是一些good reasons not to use canvas to create UI components。