Old school D3 from simpler times

All examples By author By category About

ChandrakantThakkarDigiCorp

Full window Github gist

Donult Chart D3 V4

<html>
<body>
  <script>
    window.addEventListener('resize', function (event) {
      $("#chart").width(window.innerWidth * 0.9);
      $("#chart").height(window.innerHeight);
    });
  </script>
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="donultChart.js"></script>
<div id="chart" style="width: 900;height: 500">
</div>
<script>

var data=[{  city:"Deesa",  beautifulRatio:30},{  city:"Patan",  beautifulRatio:20},{  city:"Ahmedabad",  beautifulRatio:15},{  city:"Bhabhar",  beautifulRatio:35},{  city:"BHakhasar",  beautifulRatio:50}];
    $("#chart").empty();
    var pieChartConfig = {
    mainDiv: "#chart",
    colorRange: ["#f44842", "#f4b841", "#f4f141", "#46f441", "#41f4d9", "#4941f4", "#f441d6"],
    data: data,
    caption:"city",
    tooltipLable:"City",
    value:"beautifulRatio",
    centerLabel:"Beautiful City Ratio"
  };
  var pieChart = new pieChart(pieChartConfig);
</script>
</body>
</html>

Modified http://code.jquery.com/jquery-latest.min.js to a secure url

https://code.jquery.com/jquery-latest.min.js

https://d3js.org/d3.v4.min.js