ChartJS - Графики пончиков с несколькими кольцами

Question

Возможно ли создать диаграмму пончика с несколькими кольцами, используя ChartJS, как показано ниже?

Answer 1

Вы можете узнать решение по fiddle link

var ctx = document.getElementById("chart-area").getContext("2d"); 
var myDoughnut = new Chart(ctx, config); 
var config = { 
    type: 'doughnut', 
    data: { 
     datasets: [{ 
      data: [ 
       10,20,30 
       ], 
       backgroundColor: [ 
       "#F7464A", 
       "#46BFBD", 
       "#FDB45C" 
      ], 
     }, { 
      data: [ 
       randomScalingFactor(), 
       randomScalingFactor(), 
       randomScalingFactor() 

      ], 
       backgroundColor: [ 
       "#F7464A", 
       "#46BFBD", 
       "#FDB45C" 
      ], 
     }], 
     labels: [ 
      "Red", 
      "Green", 
      "Yellow" 
     ] 
    }, 
    options: { 
     responsive: true 
    } 
}; 

Answer 2

Вам нужно добавить несколько наборов данных в таблице. они будут отображаться по мере необходимости. Посмотрите на свои собственные sample круговой диаграммы. Вы можете загрузить и открыть его локально в качестве примера. Там у них есть несколько наборов данных, что делает диаграмму такой, какой вам нужно.

Надеюсь, что это помогло.