{"version":"1.0","type":"rich","title":"SVG GROUPS","description":"This example demonstrates how SVG group elements organize and apply shared styling in a D3.js visualization. The code creates a 400-by-400 pixel SVG canvas using d3.select and appends a dark gray rectangle as background. A group (`svg:g`) is then added, containing an orange circle and a large text label, while a second, smaller white text element is appended directly to the canvas outside any group. The visualization relies on d3.v2’s SVG manipulation methods, including `append`, `attr`, and `style`, to show that group-level attributes affect all child elements, whereas ungrouped elements require individual property assignments.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-2793876?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}