Innerer Radius wird in Chart.js (Donut Chart) nicht geändert

Question

Ich verwende Chart.js Ich möchte ein halbes Donut-Diagramm wie das Bild unten. Aber ich habe es versäumt, die Dicke des Kuchens zu ändern. Ich habe versucht, die Eigenschaft innerRadius aber noch ist es nicht funktioniert

Hier ist mein Code

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 
    }); 
} 

Answer 1

Sie percentageInnerCutout Eigenschaft in options verwenden soll

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

Sie können dies auch überprüfen Frage How to vary the thickness of doughnut chart, using ChartJs.?

P.S. Wie ich es hängt von Version zu verstehen, so

Wenn Chart.js Version>2.0 Verwendung cutoutPercentage

Ansonsten percentageInnerCutout