[Chartjs]-Chart js pie or doughnut charts 3 inside instead of 1


You can do this with jqplot or chart.js

An example from jsplot:

  var s1 = [['a',6], ['b',8], ['c',14], ['d',20]];
  var s2 = [['a', 8], ['b', 12], ['c', 6], ['d', 9]];

  var plot3 = $.jqplot('chart3', [s1, s2], {
    seriesDefaults: {
      // make this a donut chart.
        // Donut's can be cut into slices like pies.
        sliceMargin: 3,
        // Pies and donuts can start at any arbitrary angle.
        startAngle: -90,
        showDataLabels: true,
        // By default, data labels show the percentage of the donut/pie.
        // You can show the data 'value' or data 'label' instead.
        dataLabels: 'value'

According to the jqplot page, it requires minimum of jquery 1.9.1, along with it’s main jqplot, plus jqplot pieRenderer/donutRenderer scripts and the jqplot css.

The code above will produce something like this:


You can add another series, which will create a third circle.

Leave a comment