{"version":"1.0","type":"rich","title":"Colour and Size Legends","description":"This example demonstrates two reusable legend components for D3 v5 visualizations: an ordinal color legend and a quantitative size legend. The color legend maps fruit categories to distinct colors using `scaleOrdinal`, while the size legend uses `scaleSqrt` to transform numeric values into circle radii. Both components render as SVG groups with tick marks and labels, using data joins and enter/merge/exit patterns for dynamic updates. The size legend generates ticks via the scale’s `ticks` method, filtering out zero, and positions circle centers according to the scaled radius.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/55c24f690358492b9d350216fcf60e21?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}