【问题标题】:Chart.js bar chart: show tooltip on label hoverChart.js 条形图:在标签悬停时显示工具提示
【发布时间】:2017-01-27 18:03:46
【问题描述】:

我正在使用 Chart.js 库来绘制条形图,并且我想不仅在条形悬停时显示工具提示,而且还希望在该条形的 x 轴标签悬停上显示工具提示。我找到了onHover 配置方法,但它只允许我访问当前悬停的条形数组,这没有用。

那么,我如何访问鼠标事件并从那里获取位置以将其与条形标签位置进行比较?还是有别的办法?

我目前的配置:

const countryChartOptions = {
    hover: {
         onHover: this.onChartHover,
    },
};

const onHover = (activeElements) => {
    console.log(activeElements);
};

它只打印出悬停的条形数据,但我一直想弄清楚如何扩展它以满足我需要的行为。

【问题讨论】:

    标签: javascript charts chart.js


    【解决方案1】:

    怎么样:

    options: {
      tooltips: {
        // Add this..
        intersect: false
      }
    }
    

    【讨论】:

      【解决方案2】:

      对我有用

        options: {
            tooltips:{
            intersect : false,
            mode:'index'
            }
         }
      

      【讨论】:

      • 选项“index: 'mode'” 完全不同。没有它,工具提示不会与光标对齐。例如,光标在“9”上,工具提示显示标签“5”(或类似的东西)的值。恕我直言,这是正确的答案。
      猜你喜欢
      • 1970-01-01
      • 2023-03-16
      • 2014-03-29
      • 1970-01-01
      • 2021-05-04
      • 1970-01-01
      • 1970-01-01
      • 2018-11-17
      • 1970-01-01
      相关资源
      最近更新 更多