Grid with D3

This is my modification of creating grids using D3 taken from Chuck Grimmet's block.

The idea is to create a grid of nrow-by-ncol rectangular grid drawn on a SVG element. I simplified the code by removing a for-loop block.

Back to index | Next: adding mouse interaction on a grid

xxxxxxxxxx
 
<!DOCTYPE HTML>
​
<html>
​
<head>
    <meta charset="utf-8">
    <title>Creating a grid</title>
    <style>
        .cell {
            fill-opacity: 0;
            stroke: black;
            stroke-width: 2pt;
        }
    </style>
</head>
​
<body>
<svg width="800" height="400"></svg>
​
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="make_grid.js"></script>
​
</body>
​
</html>
​
    

Modified http://d3js.org/d3.v4.min.js to a secure url

https://d3js.org/d3.v4.min.js