{"version":"1.0","type":"rich","title":"Color and Size Legends","description":"This example demonstrates two reusable legend components rendered with D3 v5: a color legend for ordinal scales and a size legend for square-root scales. The color legend maps fruit categories to distinct colors, while the size legend visualizes numeric values using scaled circle radii. Both components use D3 selections and data joins to update legends dynamically. The code relies on `scaleOrdinal`, `scaleSqrt`, `scale.ticks`, and custom group elements with SVG circles and text labels, styled via CSS classes.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/83a7b3d4ef0c41ed8ebc8b79d9508a35?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}