JSFiddle - React, Tailwind, and code Playground

by Neeraj Yadav

HTML

<div class='chart'></div>

JavaScript

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

var r = 90,
  P = 3 * Math.PI/2;

var group = canvas.append('g')
  .attr('transform', 'translate(100,100)');

var arc = d3.arc()
  .innerRadius(r - 1)
  .outerRadius(r)
  .startAngle(3)
  .endAngle(P - 4);

group.append('path')
  .attr('d', arc);