【发布时间】：2013-07-12 00:12:35
【问题描述】：
我正在使用 KineticJS 开发一个 HTML5 Web 应用程序。我读到 KineticJS 中有分组和分层。据我所知，它们之间没有区别。你能告诉我区别吗？
【问题讨论】：
标签： javascript html kineticjs
【发布时间】：2013-07-12 00:12:35
【问题描述】：
组只是元素或对象的组，通常可以以任何方式在层内堆叠。
图层是不同的画布区域，可以在舞台上相互叠加。
【讨论】：
-
您最后的陈述不正确。一个图层不必占据整个舞台，因此您可以一次显示多个图层。事实上，在 KineticJS 中，层和组是透明的，不能具有“填充”属性。这意味着所有图层和组在任何时候都是可见的，只要它们在视口（画布/舞台）中并且它们没有被其中包含的形状覆盖。 @markE 的答案中也提到了这一点，这是更正确和信息量更大的答案。
基本区别：组是容器，层是分隔符。
组：
- 组是层内成形对象的容器。
- 例如，一个组可能同时包含一个圆形和一个矩形。
- 可以操作一个组，并且该组中的所有元素都可以类似地操作。
- 例如，拖动组将同时拖动该组中包含的圆形和矩形。
层：
- 图层实际上是相互堆叠的独立画布元素。
- 这类似于 Photoshop 和 Illustrator 中图层的工作方式。
- 多个图层同时可见。
- 如果来自不同层的对象重叠，最上面的对象会完全显示（如 z 索引）。
组用于包含多个项目，因此可以将它们作为一个组进行操作——例如将圆和线放入一个组中以创建一个“火柴人”。移动组将移动火柴人的所有部分。
图层用于分隔不同的项目 - 例如具有不会更改的背景图层和正在发生动画的顶层。
【讨论】：
-
从 GitHub 自述文件中参考层和组结构的节点层次结构可能也很有用：github.com/ericdrowell/KineticJS/wiki 这句话也值得注意：“每个层有两个画布渲染器，一个场景渲染器和一个命中图渲染器。”在性能方面，将项目尽可能多地组合在一起很可能是明智的。并将层保持在最低限度，仅当有另一个层有意义时才制作单独的层，例如上面的示例。