JSFiddle - React, Tailwind, and code Playground

by Igor Cuckovic

HTML

<body></body>

JavaScript

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

var circle = canvas.append("circle")
    .attr("cx", 250)
    .attr("cy", 250)
    .attr("r", 50)
    .style("fill", "red");

var rectangle = canvas.append("rect")
    .attr("width", 100)
    .attr("height", 80)
    .attr("x", 60)
    .attr("y", 90)
    .attr("fill", "blue");

var line = canvas.append("line")
    .attr("x1", 20)
    .attr("y1", 40)
    .attr("x2", 400)
    .attr("y2", 120)
    .attr("stroke", "green")
    .attr("stroke-width", 9);