{"version":"1.0","type":"rich","title":"Split an SVG path into pieces","description":"The visualization demonstrates how to split a single SVG path into 20 arbitrarily sized pieces, with each piece drawn as a separate colored segment. It first draws the full path with a stroke animation, then randomly divides the path into unequal portions and renders each segment sequentially with distinct colors and separator lines. The code uses D3 v4’s `d3.line` with `curveCardinal`, `getPointAtLength` to sample points along the path, and `transition` with delays to reveal pieces in sequence. A step-by-step instruction list highlights each phase of the process.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-72808c2bab4bae93e2730b6beba8402f?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}