{"version":"1.0","type":"rich","title":"SVG Lots of Transitions","description":"This example shows a grid of 19,200 small SVG rectangles that simultaneously reverse their positions and change color from steelblue to lightgreen over three seconds. The animation creates a sweeping wave effect as each rectangle’s transition delay is based on its original row and column index. The code uses D3 v4 with `selection.transition()`, `duration()`, and `delay()` to orchestrate the movement, while the SVG attributes `x`, `y`, `width`, and `height` define the grid layout. The data is generated with `d3.range()` and positioned using modular arithmetic.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-e475b756f5dbcdb7f41ebca4a7ed2d06?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}