ラベルを削除し、棒グラフのツールチップに値のみを表示します。

Question

ChartJSライブラリを使用してグラフを作成しています。ツールチップでは、作成したデータセットからデータ値を表示しています。グラフタイプがの場合は、ドーナツです。それ以外の場合は、バーまたはhorizo​​ntalbarのグラフでは機能しません。

私は何でも、ラベルの付いたデータを表示します。

Working JSFiddle of Doughnut Chart with data in tooltip。

---

Working JSFiddle of Bar Chart with label + data in tooltip。

私がやりたいことすべては、棒グラフのツールチップに示されているラベルを削除することです。

var ctx = document.getElementById("myChart"); 
 

 
var myChart = new Chart(ctx, { 
 
    type: 'bar', 
 
    data: { 
 
    labels: [ 
 
     "Men", 
 
     "Women", 
 
     "Unknown" 
 
    ], 
 
    datasets: [{ 
 
     label: 'Sweden', 
 
     data: [60, 40, 20], 
 
     backgroundColor: [ 
 
      'rgba(158, 216, 202, 0.75)', 
 
      'rgba(255, 150, 162, 0.75)', 
 
      'rgba(160, 160, 160, 0.75)' 
 
     ] 
 
     }, 
 
     { 
 
     label: 'Netherlands', 
 
     data: [40, 70, 10], 
 
     backgroundColor: [ 
 
      'rgba(158, 216, 202, 0.5)', 
 
      'rgba(255, 150, 162, 0.5)', 
 
      'rgba(160, 160, 160, 0.5)' 
 
     ] 
 
     }, 
 
     { 
 
     data: [33, 33, 34], 
 
     backgroundColor: [ 
 
      'rgba(158, 216, 202, 0.25)', 
 
      'rgba(255, 150, 162, 0.25)', 
 
      'rgba(160, 160, 160, 0.25)' 
 
     ] 
 
     } 
 
    ] 
 
    }, 
 
    options: { 
 
    tooltips: { 
 
     callbacks: { 
 
     label: function(tooltipItem, data) { 
 
      return data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index]; 
 
     } 
 
     } 
 
    } 
 
    } 
 
});

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

 
<canvas id="myChart" width="400" height="200"></canvas>

Answer 1

ちょうど空の値でtitleオプションを使用します。このように：

callbacks: { 
     title: function(tooltipItems, data) { 
      return ''; 
     }, 
     label: function(tooltipItem, data) { 
      var datasetLabel = ''; 
      var label = data.labels[tooltipItem.index]; 
      return data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index]; 
     } 
     } 

updated jsfiddle