【问题标题】:How to get x and y offset position of legendItemClick in highcharts react js?如何在highcharts react js中获取legendItemClick的x和y偏移位置?
【发布时间】:2020-09-21 20:03:17
【问题描述】:

正是我想要的是,当单击每个图例项时,它会在该位置显示下拉菜单。

【问题讨论】:

  • 请在此处添加更多信息并发布一些代码来说明您遇到的问题以及您想要做什么。

标签: javascript jquery css reactjs react-highcharts


【解决方案1】:

既然您使用的是 react,为什么不从所需组件中任何位置的 onClick 中找到偏移量 x 和 y。 您的问题不完整,因为没有附加代码,但您需要的是事件监听器。

要让一个显示您单击的任何组件的 x 和 y 偏移量,请执行此操作;

  componentWillUnmount() {
    window.removeEventListener('click', this.handleClick);
  }

  componentDidMount() {
    window.addEventListener('click', this.handleClick);

现在,创建一个名为 handleClick 的函数并将事件作为参数传递,例如:

handleClick = (e) => {
 console.log(e.offsetX,e.offsetY)
    }
  }

最后,给组件一个onClick属性并传入this.handleClick作为要运行的函数:

<div className="charts" onClick={this.handleClick}>
</div>

注意:理想情况下,您最好在有状态组件中完成所有这些操作。

【讨论】:

    【解决方案2】:

    试试这个解决方案,您可以在其中找到点击位置的chartXchartY 坐标。

    演示:https://codesandbox.io/s/highcharts-react-demo-xb769

    它是否足以满足您的要求?

    【讨论】:

      猜你喜欢
      • 2016-12-27
      • 1970-01-01
      • 1970-01-01
      • 2014-01-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多