Chartjs套餐饼图/甜甜圈图表

Question

Chart.js制作了一些很棒的外观图表，到目前为止我一直对我非常满意。我想创造的东西是这样的：

这可能吗？

Answer 1

我认为这是Chart.js 2.0版的可能性。这里有一个例子：

var ctx = document.getElementById("myChart"); 
 
var chartData = { 
 
    labels: [ 
 
    "Red", 
 
    "Blue", 
 
    "Yellow" 
 
    ], 
 
    datasets: [{ 
 
    data: [300, 50, 100], 
 
    backgroundColor: [ 
 
     "#FF6384", 
 
     "#36A2EB", 
 
     "#FFCE56" 
 
    ], 
 
    hoverBackgroundColor: [ 
 
     "#FF6384", 
 
     "#36A2EB", 
 
     "#FFCE56" 
 
    ] 
 
    }, { 
 
    data: [200, 100, 25, 25, 66, 34], 
 
    backgroundColor: [ 
 
     "#FF6384", 
 
     "#36A2EB", 
 
     "#FFCE56", 
 
     "#FF6384", 
 
     "#36A2EB", 
 
     "#FFCE56" 
 
    ], 
 
    hoverBackgroundColor: [ 
 
     "#FF6384", 
 
     "#36A2EB", 
 
     "#FFCE56", 
 
     "#FF6384", 
 
     "#36A2EB", 
 
     "#FFCE56" 
 
    ] 
 
    }] 
 
}; 
 
var pieChart = new Chart(ctx, { 
 
    type: 'pie', 
 
    data: chartData 
 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.3.0/Chart.min.js"></script> 
 

 
<canvas id="myChart" width="300" height="300"></canvas>