• The SVG Group Element is used to group SVG Elements together (much like a container)
• There are two main reasons to use the SVG Group Element - for grouping SVG Elements and for doing transformations to the coordinate space the SVG Elements are in
• The most common SVG Group element transformation in D3 is the Translate Transformation
• The SVG Group Element Translate transformation allows you to move all of the elements inside of the <g> ... </g> a certain numbers of units in the X direction and a certain number of units in the Y direction
• At a deeper level, what the SVG Group Element transform is doing is transforming the SVG Coordinate Space
• You can append an SVG Group element just like any other HTML / SVG DOM element
• If you create a selection whose parent node is the SVG Group Element, then every element you append to that selection will live within the SVG Group Element
• Because you can define / update the attribute value pairs of DOM elements, you can use D3 to define and update the SVG Group Element transform translate attribute value pair

D3 Video Tutorial Lessons:

• Creating SVG Elements from Data
• Using the SVG Coordinate Space
• Dynamic SVG Coordinate Space
• SVG Group Element