JSFiddle - React, Tailwind, and code Playground

by Serhii Matrunchyk

HTML

<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>

<button class="randomize">randomize</button>
		<div data-role="doughpie" data-width="750" data-height="550" id="graph"></div>

CSS

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  width: 560px;
  height: 500px;
  position: relative;
  background: #292527;
}

path.slice {
  stroke-width: 2px;
}

.bubbletext {
  fill: #ffffff;
  font-size: 14px;
}

JavaScript

$('[data-role="doughpie"]').each(function(index) {
		        createDoughnut(this);
		    });



//custom bubble chart