Mapbox GL-JS 中地图上同时有两个光标
Two cursors on maps at same time in Mapbox GL-JS
我正在使用 Mapbox 开发天气雷达查看器。在某个模式下，屏幕上同时出现2张Mapbox地图，显示雷达的不同模式。地图彼此锁定。当一张地图移动、旋转或平移时，另一张地图也会移动、旋转或平移。我通过简单地将一张地图的属性传递给另一张地图来做到这一点。在下面的屏幕截图中，您将看到它们如何显示相同的位置。
我想要做的是 - 当用户将鼠标悬停在“map1”上时，我想要在“map2”上有一个相同的（幻影或假）光标。这是我想要做的：
（编辑：您看到的是实际屏幕截图。如果这有助于解释，每张地图都包含在屏幕宽度为 50% 的 DIV 中）
我不知道这在 Mapbox 中是否可行。希望有人能提供一些指导，因为我找不到与此相关的任何其他问题，而且我真的没有代码可以显示，不知道从哪里开始。
如果您尝试在 Mapbox-GL-JS 内部执行此操作（例如，通过不断更新 GeoJSON 要素层的位置），我认为性能会很差。
但由于这两个视图完全锁定（并且可能是完全相同的尺寸），您可以在 HTML/CSS 级别执行此操作。检测第一张地图上的鼠标移动，并更新悬停在第二张地图上的 absolutely-positioned 元素的位置以匹配。
另一种方法是使用 canvas 元素覆盖在第二张地图上，同样更新。
我正在使用 Mapbox 开发天气雷达查看器。在某个模式下，屏幕上同时出现2张Mapbox地图，显示雷达的不同模式。地图彼此锁定。当一张地图移动、旋转或平移时，另一张地图也会移动、旋转或平移。我通过简单地将一张地图的属性传递给另一张地图来做到这一点。在下面的屏幕截图中，您将看到它们如何显示相同的位置。
我想要做的是 - 当用户将鼠标悬停在“map1”上时，我想要在“map2”上有一个相同的（幻影或假）光标。这是我想要做的：
（编辑：您看到的是实际屏幕截图。如果这有助于解释，每张地图都包含在屏幕宽度为 50% 的 DIV 中）
我不知道这在 Mapbox 中是否可行。希望有人能提供一些指导，因为我找不到与此相关的任何其他问题，而且我真的没有代码可以显示，不知道从哪里开始。
如果您尝试在 Mapbox-GL-JS 内部执行此操作（例如，通过不断更新 GeoJSON 要素层的位置），我认为性能会很差。
但由于这两个视图完全锁定（并且可能是完全相同的尺寸），您可以在 HTML/CSS 级别执行此操作。检测第一张地图上的鼠标移动，并更新悬停在第二张地图上的 absolutely-positioned 元素的位置以匹配。
另一种方法是使用 canvas 元素覆盖在第二张地图上，同样更新。