{"version":"1.0","type":"rich","title":"More complex SVG + D3","description":"This example demonstrates SVG masking with D3, where 100 horizontal and 100 vertical rectangles render as a grid and are selectively revealed through two masks. The masks contain symbol paths from `d3.symbol` and `d3.symbols`, with one mask inverted to create contrasting visibility. Using `d3.select`, `d3.range`, and `selection.join`, the code appends rectangles and paths directly to the SVG, positioning symbols at evenly spaced intervals. The `renderMask` function accepts an inverted flag to alternate fill colors between black and white, showcasing how D3 v7 enables dynamic mask construction.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/49884cb86f86457fb14b844433b0a192?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}