JSFiddle - React, Tailwind, and code Playground

by Shawn Allen

HTML

<svg></svg>

CSS

path {
    fill: none;
    stroke: black;
    stroke-width: 2;
}

JavaScript

var width = 400,
    height = 200,
    line = d3.svg.line(),
    points = d3.range(0, width + 10, 10).map(function(x) {
      return [x, randomY()];
    });

function randomY() {
    return height / 2 - 50 + 100 * Math.random();
}

var svg = d3.select("svg")
        .attr("width", width)
        .attr("height", height),
    path = svg.append("path")
        .attr("d", line(points));