{"version":"1.0","type":"rich","title":"data join","description":"This example demonstrates the D3 data join pattern by binding an array of city population objects to SVG rectangles and text labels, producing a simple horizontal bar chart. The code uses `select` and `data` from D3 v7, with the `.join` method to create elements for each datapoint. Rectangles are sized proportionally to population via a scale factor, while a separate join on a `.labels` group renders each city’s name. The SVG canvas is fixed at 2000×2000, with five cities hardcoded in the script.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/9edc899cf05143e295bc7687407083a6?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}