Question

请注意，然后阅读以下内容： 如果您知道答案，这是我正在上大学课程的一个项目。请只向正确的方向暗示我或举一个例子。基于相同的原因，我也不会发布全部代码，但会详细描述我的进度。

对于这个项目，我用d3创建了一个地图。我正在添加功能，但是在互联网上搜索了几个小时并尝试了一些方法之后，我找不到该问题的答案：

要在地图的侧边栏中显示其他信息，我需要检查数据中的坐标是否在给定的svg路径中。我可以使用以下方法在地图上显示坐标：

var coords = projection([longitude, latitude]);

之后，我可以使用数组在正确的区域中显示坐标。

路径绘制如下：

svg.selectAll(".geodata")
  .data(geodata)
  .enter().append("path")

地理数据的定义是：

var geodata = topojson.feature(data, data.objects.collection).features;

这是转换为geojson的topojson。（由于这些文件较小，因此将其存储为topojson，这将在Web应用程序上使用。）

但是，我无法检查某些坐标是否在给定路径中，这是我尝试过的事情：

polygonContains（）-我相信这是行不通的，因为我正在使用路径，即使从技术上讲它是一个多边形，它当然也不会存储为多边形，所以我无法以这种方式进行操作。
document.elementByPoint（）-这将返回最上面的元素，而转到较低的元素将无济于事，因为那时我无法区分特定路径。

如果您有想法或实例，我想在下面听到。：）

给出的答案：

将显示设置为无，然后在elementByPoint下找到您的元素：

console.log(this);
var element = document.elementFromPoint(coords[0], coords[1]);
console.log(element);
element.style.display = "none";

我的评论：这不起作用，它会在div标签内为您提供结果，而不是您单击的相应路径（在此示例中为县）。

Answer 1

由于我无法在评论部分中将问题标记为已回答，因此我将在此处复制评论并将其标记为已回答。

使用svg路径查看点是否在多边形内时假设笛卡尔坐标-当d3沿大圆坐标采样路径时，采样率可能足够粗糙，以至于某个点落在svg形状之外但在地理范围内功能（它会在视觉上显示在我们的边框上）。尝试将d3.geoContains（）与原始地理数据一起使用（如果您的原始地理数据是球形的：纬度和经度对）– Andrew Reid

非常感谢安德鲁！

编辑：我现在注意到我无法在接下来的2天中将其设置为“已回答”，因此我将在以后进行。

在D3 SVG路径中查找坐标

1 个答案: