刪除標籤並僅顯示條形圖工具提示中的值

我正在使用ChartJS庫創建圖表。在工具提示中，我顯示了我創建的數據集的數據值。它適用於如果圖表類型爲甜甜圈。否則它不起作用的情況下或酒吧或水平酒吧圖表。刪除標籤並僅顯示條形圖工具提示中的值

無論我做什麼，它顯示數據與標籤。

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>

來源

2017-02-17 Suhaib Janjua

只使用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

來源

2017-02-17 10:05:37 pumpkinzzz

耶。這就是我一直在尋找的。如果您分享如何設置工具提示的樣式，或者需要使用哪些屬性來設置樣式，那將非常棒。 –

刪除標籤並僅顯示條形圖工具提示中的值

回答

相關問題