{"version":"1.0","type":"rich","title":"Color Legends","description":"This example shows a reusable color legend component that maps ordinal categories to colored circles with labels. Using d3.scaleOrdinal, it defines a domain of fruit types and a range of colors, rendering each category as a red or yellow circle positioned horizontally with a text label below. The code exports a colorLegend function that leverages D3’s enter, merge, and exit selections to update groups dynamically, while the SVG is populated via d3.select and custom xPosition and height-based transforms.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/3624cf463c6845ffa7478ce1bb382732?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}