ChartJs - 是否可以在一个数据集中仅显示工具提示?

问题描述 投票:0回答:2

我有两个数据集,一个是一行,第二个是一个条。

问题是工具提示在两个数据集中都有效,我想只在第一个工作提示中工作。

我只想在bar数据集上显示工具提示,是否可能?

这是我的代码。

var chartData = {
  labels: ["January", "February", "March"],
  datasets: [
    {
      type: "line",
      label: "OEE",
      tooltip: false,
      borderColor: window.chartColors.red,
      borderWidth: 2,
      fill: false,
      data: [0,10,0,15]
    },
    {
      type: "bar",
      label: "Paro",
      backgroundColor: window.chartColors.yellow,
      data: [0,6,0,0],
      borderColor: "white",
      borderWidth: 2

    }
  ]
};
window.onload = function() {
  var ctx = document.getElementById("canvas").getContext("2d");
  window.myMixedChart = new Chart(ctx, {
    type: "bar",
    data: chartData,
    options: {
      responsive: true,
      title: {
        display: true,
        text: "Test"
      },
    tooltips: {
      callbacks: {
        title: function(tooltipItem) {
          return "Title";
        },
        label: function(tooltipItem) {
          return "Reason";
        }
      },
      backgroundColor: '#FFF',
      titleFontSize: 16,
      titleFontColor: '#0066ff',
      bodyFontColor: '#000',
      bodyFontSize: 14,
      displayColors: false
    }
    }
  });
};

提前致谢。

angular chart.js chartjs-2.6.0
2个回答
0
投票

您可以检查类型并将其禁用为,

tooltips: {
          filter: function (tooltipItem, data) {
              var type = data.type;
              if (type == "Bar") {
                return true;
              } else {
                return false;
              }
          }

0
投票

编辑Sajeetharan的代码,这对我有用:

    tooltips: {
      filter: function (tooltipItem, data) {
        const type = data.datasets[tooltipItem.datasetIndex].type;
        if (type === 'bar') {
          return true;
        } else {
          return false;
        }
      }
    }
© www.soinside.com 2019 - 2024. All rights reserved.