Goals : - Divide a svg element in 4 sub svg elements
Elements to grasp :
The D3 Select module : understand how DOM elements can be created, selected, modified.
How View port works for french speakers.
This example is used to understand the SVG viewport and viewbox - Ludo;
Improvements since the start : - Style of lines are defined in CSS. - Number of Horizontal and Vertical are parameter - For automatic Display, number of lines and viewbox dimensions are now linked. - Viewbox dimensions is not hardcoded anymore
This is based in SVG Path Tutorial • Easy to Understand!, made by Roberto Matthews.