Chart.jsの半分のドーナツにデータ値を表示する方法

半分のドーナツチャートにデータ値を表示することは可能ですか？ここでは、配列から値を取ることによって、チャートの下部にあるテキストとしてデータ値を表示したいことは、リンクです：事前に助けをhttps://jsfiddle.net/z638ttv0/16/Chart.jsの半分のドーナツにデータ値を表示する方法

おかげ

var ctx = document.getElementById("myChart"); 
var myChart = new Chart(ctx, { 
    type: 'doughnut', 
    data: { 
     labels: ["Red"], 
     datasets: [{ 
      label: '# of Votes', 
      data: [50,100-50], 
      backgroundColor: [ 

       'rgba(255, 159, 64, 0.2)' 
      ], 
      borderColor: [ 

       'rgba(255, 159, 64, 1)' 
      ], 
      borderWidth: 1 
     }] 
    }, 
    options: { 
     rotation: 1 * Math.PI, 
     circumference: 1 * Math.PI 
    } 
});

出典

2017-03-09 Harshit

var ctx = document.getElementById("myChart"); 
 
var myChart = new Chart(ctx, { 
 
    type: 'doughnut', 
 
    data: { 
 
     labels: ["Red"], 
 
     datasets: [{ 
 
      label: '# of Votes', 
 
      data: [50,100-50], 
 
      text: "ff", 
 
      backgroundColor: [ 
 
       
 
       'rgba(255, 159, 64, 0.2)' 
 
      ], 
 
      borderColor: [ 
 
       
 
       'rgba(255, 159, 64, 1)' 
 
      ], 
 
      borderWidth: 1 
 
     }] 
 
    }, 
 
    options: { 
 
     rotation: 1 * Math.PI, 
 
     circumference: 1 * Math.PI 
 
    } 
 
});

.test 
 
{ 
 
    position:absolute; 
 
    bottom:-20px; 
 
    left:calc(50% - 10px); 
 
    display:block; 
 
}

<body> 
 
<span class="test">test</span> 
 
    <canvas id="myChart" width="400" height="400"></canvas> 
 
    
 

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

 
</body>

カスタマイズされた値

出典

2017-03-09 08:22:59

返信用にthanxですが、私は "data：[50]"をそれをCSSでスタイリングする – Harshit

Chart.jsの半分のドーナツにデータ値を表示する方法

答えて

関連する問題