What are the differences between group and layer in KineticJs
html, javascript, kineticjs
Solution
The basic difference: Groups are containers while Layers are separators.
Group:
- A group is a container for shaped objects inside a layer.
- For example, a group might contain both a circle and a rectangle.
- A group can be manipulated and all elements within that group are similarly manipulated.
- For example, dragging a group will simultaneously drag a circle and rectangle contained in that group.
Layer:
- Layers are actually separate canvas elements that are stacked atop each other.
- This is similar to the way layers work in Photoshop and Illustrator.
- Multiple layers are visible simultaneously.
- If objects from different layers overlap, the topmost object displays fully (like z-indexing).
Groups are used to contain multiple items so they can be manipulated as a group--like putting circles and lines into a group to create a "stickman". Moving the group will move all the pieces of the stickman.
Layers are used to separate different items--like having a background layer that doesn't change and a top layer where animation is occurring.
Problem
I am developing a HTML5 web application using KineticJS. I read that in KineticJS there are grouping and layering. As far as I know there are no differences between them. Can you tell me the differences?