Chart.js（甜甜圈圖）中的內半徑沒有變化

我正在使用Chart.js我想要一個半圓環圖，就像下圖所示。但我沒有改變派的厚度。我試過財產innerRadius但它仍然不工作Chart.js（甜甜圈圖）中的內半徑沒有變化

這裏是我的代碼

public getHalfDoughnutChart(records) { 
    let data = { 
     labels: ["Worked Hours","Remaining Hours"], 
     datasets: [{ 
     label: 'Today\'s Worked Hours', 
     data: [records.length? records[0].duration.hour: 0,9], 
     backgroundColor: [ 
      'rgba(75, 174, 79, 1)', 
      'rgba(255, 255, 255, 0)' 
     ] 
    }] 
}; 

    let options = { 
     circumference: Math.PI, 
     rotation: 1.0 * Math.PI, 
     innerRadius: "10%", 
     legend: { 
     display: false 
     }, 
     layout:{ 
     padding:40 
     }, 
    } 

    return this.getChart(this.halfDoughnutCanvas.nativeElement, "doughnut", data, options); 
    } 



getChart(context, chartType, data, options?) { 
    return new Chart(context, { 
     type: chartType, 
     data: data, 
     options: options 
    }); 
}

來源

2017-04-20 Zohra Gadiwala

您應該使用percentageInnerCutout財產options對象

let options = { 
    circumference: Math.PI, 
    rotation: 1.0 * Math.PI, 
    percentageInnerCutout: 10, 
    legend: { 
    display: false 
    }, 
    layout:{ 
    padding:40 
    }, 
}

您還可以檢查此question How to vary the thickness of doughnut chart, using ChartJs.?

P.S.據我所知這取決於版本，所以

如果chart.js之版本>2.0使用cutoutPercentage

否則使用percentageInnerCutout

來源

2017-04-20 16:05:12 Leguest

已經嘗試過，但沒有工作:( –

什麼chart.js之版本你使用？ – Leguest

它的工作感謝:) –

Chart.js（甜甜圈圖）中的內半徑沒有變化

回答

相關問題