{"version":"1.0","type":"rich","title":"Progress Nav","description":"This example shows a page navigation where a smooth, highlighted path marks the table of contents sections currently in view as the user scrolls. The visualization uses an SVG path as a progress marker, with its stroke-dasharray and stroke-dashoffset updated dynamically to reveal only the portion corresponding to visible content. It relies on the `getBoundingClientRect` API to determine element visibility and the SVG `getTotalLength` method to measure path segments. The marker animates via CSS transitions, and the layout is styled with SCSS.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-ead9725196255b2d8df7b7de6ce0170b?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}