react-google-charts点击事件不起作用

Question

According to the documentation，您可以isAuthenticated给出的示例使用env可以正常工作（我已经设置了示例here。当我尝试使用时出现问题任何其他图表类型。

从Google图表文档中，对于bar chart，我应该可以使用click事件：

当我添加如下点击事件时：

Set the chart-specific events you want to listen to and the corresponding callback.

什么也没有发生，但是select事件仍然有效。我已经设置了一个代码沙箱here来演示此行为。 animationfinish，onmouseover以及我检查过的所有其他事件也会发生这种情况。

Answer 1

除了@jake提供的解决方案之外，chartWrapper在回调事件中不再可用。就我而言，将其替换为wrapper是可行的。喜欢

<Chart
  chartType="ScatterChart"
  width="80%"
  height="400px"
  data={data}
  options={options}
  legendToggle
  chartEvents={[
    {
      eventName: "ready",
      callback: ({ wrapper, google }) => {
        const chart = chartWrapper.getChart();
        google.visualization.events.addListener(chart, "onmouseover", e => {
          const { row, column } = e;
          console.warn("MOUSE OVER ", { row, column });
        });
        google.visualization.events.addListener(chart, "onmouseout", e => {
          const { row, column } = e;
          console.warn("MOUSE OUT ", { row, column });
        });
      }
    }
  ]}
/>```

Answer 2

看起来rakannimer已在#263的GitHub repository中回答了此问题，但我想我还是会回答这个问题，以防其他人遇到此问题。

由于this堆栈溢出答案做了很好的解释，因此必须先触发select事件，然后才能触发图表事件（如屏幕快照中的事件）。因此，如果您想使用任何其他事件，则必须在像this这样的回调中将其初始化：

  {
    eventName: "click",
    callback({}) {
      console.log("clicked");
    }
  }