{"version":"1.0","type":"rich","title":"Color and Size Legend","description":"This example demonstrates two reusable D3 legend components: an ordinal color legend and a square-root size legend, rendered side-by-side in an SVG. The color legend maps five categorical domain values to a spectral color palette, with labeled circles spaced vertically, while the size legend encodes numeric ticks with scaled circle radii and translucent fills. Both use D3 v5 data joins (`selection.enter`, `.merge`) and scales (`scaleOrdinal`, `scaleSqrt`), and are invoked via the `.call()` method with custom props for radius, spacing, and text offset.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/7447457480e549db959d4beb55932ad9?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}