JSFiddle - React, Tailwind, and code Playground

by Krishna sarma

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js"></script>
<script src="//d3js.org/d3.v3.min.js"></script>
<div id="canvas"></div>

JavaScript

var svg = d3.select("#canvas").append("svg")
        .attr("width", 600)
        .attr("height", 600);

    for (var i = 0; i <= 10; i++) {
            
            svg.append("line")
                .attr("x1", i*60)
                .attr("y1", 0)
                .attr("x2", i*60)
                .attr("y2", 600)
                .attr("stroke-width", 0.5)
                .attr("stroke", "grey");
            svg.append("line")
                .attr("x1", 0)
                .attr("y1", i * 60)
                .attr("x2", 600)
                .attr("y2", i * 60)
                .attr("stroke-width", 0.5)
                .attr("stroke", "grey");
            
    }