charts - 如何在图例悬停的 Google 饼图上显示工具提示？

Question

我想在图例中显示鼠标悬停时切片的工具提示。默认情况下，仅当鼠标悬停在饼图上时才会显示工具提示。

目前我最接近的是当我点击图例时显示工具提示，其中：

tooltip: { trigger: 'selection' }

作为我绘制图表时的选项。

我试图在参考中找到一些东西，但没有结果。

score 10 · Accepted Answer

你很亲密。保留tooltip: { trigger: 'selection' }并添加一个事件监听器onmouseover：

google.visualization.events.addListener(chart, 'onmouseover', function(entry) {
   chart.setSelection([{row: entry.row}]);
});

这将在鼠标悬停图例时显示工具提示。正如文档所说onmouseover：

当用户将鼠标悬停在可视实体上时触发。传回相应数据表元素的行和列索引。切片或图例条目与数据表中的一行相关（列索引为空）。

所以上面的代码只是简单地模拟了与被悬停的图例对应的行的选择。我还将添加一个onmouseout侦听器，因此当鼠标离开图表时工具提示不会挂起：

google.visualization.events.addListener(chart, 'onmouseout', function(entry) {
   chart.setSelection([]);
});

1 回答 1