d3 / topojson区域映射中的工具提示不起作用

Question

我有一个Choropleth map，其中工具提示适用于大多数工具，但是中心状态现在正在显示工具提示...表面上，它们甚至根本没有运行mouseout回调函数（已通过console.log命令）。

起初，我使用的是d3-tip，但这种方法不起作用，而且是第一次尝试使用它，所以我认为我可能做错了什么，因此我选择实现一个在{ {1}}和display: none，当它仍然不起作用时，我输入了console.log命令来查看回调函数是否正在运行，而没有运行。这主要是堪萨斯州的问题，但周边州的一些县也有问题。而且我知道数据集不是问题，因为从同一数据集中提取的example工作正常。

以下是工具提示的CSS：

display: block

和JS代码：

#tooltip{
  display: none;
  background-color: rgba(32,32,32,1);
  position: absolute;
  border-radius: 10px;
  padding: 10px;
  width: 200px;
  height: 40px;
  color: white
}

Answer 1

问题是您正在将填充应用于状态网格。让我们将填充从rgba(0,0,0,0)更改为rgba(10,10,10,0.1)：

现在应该清楚为什么在某些区域不能进行鼠标交互：网格被填充在其顶部。不管由于其不透明度为0而看不到网格物体，它仍然会拦截鼠标事件。

网格仅用于表示边界：它是geojson lineString的集合（也请参见here）。网格不是要填充的，只能有一个笔触。

如果将网格填充更改为none，或将网格的指针事件更改为无，则地图将按预期工作。