JSFiddle - React, Tailwind, and code Playground

by k_sav

HTML

<div id="chart"></div>

JavaScript

var w = 400;
var h = 400;
var r = h / 2;


var vis = d3.select('#chart').append("svg:svg").attr("width", w).attr("height", h).append("svg:g").attr("transform", "translate(" + r + "," + r + ")");

// declare an arc generator function
var arc = d3.svg.arc()
  .innerRadius(10)
  .outerRadius(100)
  .startAngle(-Math.PI/2)
  .endAngle(Math.PI/2);

// select paths, use arc generator to draw
vis.append("svg:path")
  .attr("fill", "red")
  .attr("d", arc);