{"version":"1.0","type":"rich","title":"heatmap_cities","description":"This example visualizes screen dimensions by rendering the current browser width and height as a large, heatmap-like typographic display. It shows a minimal grid of numeric cell blocks that update based on window size, with the current viewport measurements logged to the console. The code uses D3 v7’s `select` and `range` functions to manage the DOM and generate table structures, while dynamically reading `window.innerWidth` and `window.innerHeight` to populate the layout. The rendering approach relies on raw JavaScript and D3’s data-binding to build the visualization in a blank HTML body.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/dc6143511ef6421f88c02e5641634f9f?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}