时间戳

首页 > 解决方案 > chart js 停止图表区域功能

javascript - chart js 停止图表区域功能

问题描述

我正在使用图表 js 插件。我正在使用两个功能。第一个函数在用户单击图表时调用。第二个函数在用户单击图例区域时调用。检查以下示例。

当我单击图例区域时，图表区域功能也可以使用。我需要限制它。请检查我的样品。你可以理解我的意思。

图表区域功能：

    onClick: function(e, array){
    alert('clicked on chart area')
}

图例区域功能：

onClick: function(e, legend_item){
    alert('clicked on legend')
}

演示 演示

标签： javascriptcharts

解决方案

这是一种解决方案。我们使用 this.chart.chartArea 检查点击是否在图表区域内。这计算了图表区域的偏移量，我们可以看看它是否在里面。

onClick: function(e, array){
  const { left, right, top, bottom} = this.chart.chartArea;
  if(
    event.offsetX > left && 
    event.offsetX < right &&
    event.offsetY > top && 
    event.offsetY < bottom
  ){
    alert('clicked on chart area')
  }
},

推荐阅读