d3.js - 如何在 nivo 折线图上实现该功能？

Question

我正在尝试从 nivo 折线图 ( https://nivo.rocks/line ) 中实现此功能，其中当我将光标放在图表上时，工具提示始终出现在图表上，并且工具提示始终出现在一个点旁边。使工具提示始终出现并且工具提示位置之间的转换很容易，但我不明白它如何计算最接近我的指针的点，我已经查看了源代码，但我在这里有点不知所措，我是绘制一个完整的空白，任何帮助将不胜感激，如果您可以展示一些具有此功能的源代码的演示，那将是一个很大的帮助。

标签： d3.js

Answer 1

它使用d3-delaunay计算 Voronoi 图，以便找到最近的点。

voronoi = d3.Delaunay
  .from(data, d => x(d.x), d => y(d.y))
  .voronoi([0, 0, width, height])

您可以在官方Learn D3 文档中找到该技术的展示。