Chartjs內分離 -

Question

我需要幫助繪製餅圖要複製這樣的

enter image description here

在JavaScript

var ctx = document.getElementById('FailingChart').getContext('2d'); 
    var myChart = new Chart(ctx, { 
     type: 'pie', 
     segmentShowStroke: true, 

     data: { 
      labels: ["PASS","FAIL"], 
      datasets: [{ 
       backgroundColor: [ 


       "Red", "#2ecc71", 
       ], 
       data:[[5,8,6,5],76] 
      }] 
     }, 

     animation: { 
      animateScale: true, 
     } 
    }); 

    var legend = myChart.generateLegend(); 
    $("#legend").html(legend); 
</script> 

但沒有工作

兩個標籤試圖76％和24％ 必須是24％拆成各種5,8,6,5

有什麼想法嗎？

Answer 1

Solved this scenario by adding multiple dataset for pie chart 
Code: 
var chartData = { 
      labels: [], 
      datasets: [{ 
       label: ["Fail", "Pass"], 

       data: [24, 76], 
       backgroundColor: [ 
        "#FF0000", 
       "#90EE90" 
       ], 

      }, { 
       label: ["C1", "C2", "C3", "C4", "C5", "C6", "C7", "Total"], 

       data: [0.5, 0.12, 0.25, 0.40, 0.22, 0.36,5.6], 
       backgroundColor: [ 
        "#766757", 
        "#FCB441", 
        "#E0400A", 
        "#056492", 
        "#BFBFBF", 
        "#1A3B69", 
        "#90EE90" 
       ], 

      }] 
     }; 
     var options = { 

      legend: false, 


     } 
     var pieChart = new Chart(ctx, { 
      type: 'pie', 
      data: chartData, 
      options: options 



     });