Search code examples
jqueryd3.jschartspie-chartdimple.js

Dimple/D3 Pie chart with missing pieces

If I have a percentage of a pie chart say 90% is there a way in dimple to create a pie chart that only shows 90% and the other 10% is a missing slice? Thanks.

Solution 
  • var arc = d3.arc()
    .startAngle(0)
    .endAngle(Math.PI * 2);

    Will set your start angle at 0, and then end at 2PI. you can multiply this however you wish to get your desired angle.

    var svg = d3.select("body")
    .append("svg")
    .attr("width", 200)
    .attr("height", 200)
    .append("g")
    .attr("transform", "translate(100,100)");

var arc = d3.svg.arc()
    .innerRadius(0)
    .outerRadius(70)
    .startAngle(0)
    .endAngle(2 * Math.PI * 0.9);

svg.append("path")
    .attr("class", "arc")
    .attr("d", arc);
    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>