{"version":"1.0","type":"rich","title":"181202_01_Viewport","description":"This example demonstrates how the SVG viewport and viewBox interact to scale a coordinate system. A set of vertical and horizontal path elements, drawn as colored lines, is defined within a viewBox of “0 0 100 50” and rendered inside an SVG element with a blue border. The number of horizontal and vertical lines is parameterized, and their positions are calculated dynamically using D3’s `range` function. The code uses D3 v5 to append paths to the SVG, while line styling is specified in an external CSS file.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/ae64a8601ad1412c95de88e6f2e5b6ad?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}