{"version":"1.0","type":"rich","title":"d3 Color and Size Legends","description":"This example demonstrates how to build reusable legend components for both color and size scales. Two separate legends are rendered in an SVG: one showing fruit categories as colored circles using a d3 scaleOrdinal, and another displaying a d3 scaleSqrt with five tick values as scaled circles. The colorLegend and sizeLegend functions manage enter/update/exit selections, appending circle and text elements with attributed transforms and offsets. The code relies on d3-selection methods like selectAll, merge, and exit, with styling applied through external CSS classes.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/f32b7eea08584c369924e9b6050560ba?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}