無法獲取ChartJS上的折線圖工具提示

Question

我想使用ChartJS創建多折線圖。多線圖工作正常。但只有工具提示我遇到問題。請檢查下面的代碼和圖像。

var ctx = document.getElementById("myChart").getContext("2d"); 
 

 
var data = { 
 
    labels: ["January", "February", "March", "April", "May", "June", "July"], 
 
    datasets: [ 
 
     { 
 
      label: "My First dataset", 
 
      fill: false, 
 
      lineTension: 0.1, 
 
      backgroundColor: "rgba(75,192,192,0.4)", 
 
      borderColor: "rgba(75,192,192,1)", 
 
      borderCapStyle: 'butt', 
 
      borderDash: [], 
 
      borderDashOffset: 0.0, 
 
      borderJoinStyle: 'miter', 
 
      pointBorderColor: "rgba(75,192,192,1)", 
 
      pointBackgroundColor: "#fff", 
 
      pointBorderWidth: 1, 
 
      pointHoverRadius: 5, 
 
      pointHoverBackgroundColor: "rgba(75,192,192,1)", 
 
      pointHoverBorderColor: "rgba(220,220,220,1)", 
 
      pointHoverBorderWidth: 2, 
 
      pointRadius: 1, 
 
      pointHitRadius: 10, 
 
      data: [65, 59, 80, 81, 56, 55, 40], 
 
      spanGaps: false, 
 
     }, 
 
     { 
 
      label: "My Second dataset", 
 
      fill: false, 
 
      lineTension: 0.1, 
 
      backgroundColor: "rgba(255, 99, 132, 1)", 
 
      borderColor: "rgba(255, 99, 132, 1)", 
 
      borderCapStyle: 'butt', 
 
      borderDash: [], 
 
      borderDashOffset: 0.0, 
 
      borderJoinStyle: 'miter', 
 
      pointBorderColor: "rgba(255, 99, 132, 1)", 
 
      pointBackgroundColor: "#fff", 
 
      pointBorderWidth: 1, 
 
      pointHoverRadius: 5, 
 
      pointHoverBackgroundColor: "rgba(255, 99, 132, 1)", 
 
      pointHoverBorderColor: "rgba(255, 99, 132, 1)", 
 
      pointHoverBorderWidth: 2, 
 
      pointRadius: 1, 
 
      pointHitRadius: 10, 
 
      data: [40, 59, 80, 100, 56, 80, 70], 
 
      spanGaps: false, 
 
     } 
 
    ] 
 
}; 
 

 
var myLineChart = new Chart(ctx, { 
 
    type: 'line', 
 
    data: data 
 
});

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

 

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

一月月我有兩個數據[ 「我的第一數據集」：65， 「我的第二數據集」：40]，以便工具提示示出正常，但在三月份月我有兩個數據[「我的第一個數據集」：80，「我的第二個數據集」：80]，但工具提示只顯示「我的第一個數據集」值，所以我不能找到「我的第二個數據集」值。

Answer 1

我試過這樣。現在它的做工精細

options: { 
       tooltips: { 
        mode: 'label' 
       } 
     }