Question

我正在尝试学习如何使用Javascript库leaflet和d3来创建各种地图可视化。

我一直关注this tutorial，它创造了一个具有一定互动性的美国等值地图。这提供了我需要的一些东西，但我想要的主要功能是根据它们属于哪个区域来分类纬度/经度坐标。

这意味着，例如，在教程地图中，如果我有一个纬度较长的值（55，-3）属于亚利桑那州的多边形状态，程序可以将此点归类为属于亚利桑那州。

在传单（或d3）库中是否有一个函数允许我输入lat长坐标作为参数并返回它所属的特征的名称？上面的教程允许您通过onEveryFeature属性将函数附加到每个要素，并且可以在每个要素悬停时触发鼠标悬停事件。当然有一种方法可以将此功能扩展为数字输入数据而不是鼠标点吗？

Answer 1

如果您希望这样做，传单需要进行一些调整。它将鼠标点击处理留给浏览器，因此不需要逻辑来确定点是否位于多边形内。

我对d3知之甚少，但对于我来说这是如何开箱即用的并不是很明显。看一下多边形代码，我找到了一个剪切算法和无限直线的交集。

但是，如果添加第三个库，则应该相当简单。 OpenLayers Geometry库can determine if a point lies inside a polygon。

编辑：我让这个工作，另见http://jsfiddle.net/VaY3E/4/

var parser = new OpenLayers.Format.GeoJSON();
var vectors = parser.read(statesData);
var lat = 36;
var lon = -96;
var point = new OpenLayers.Geometry.Point(lon, lat);
for( var i = 0; i< vectors.length; i++ ){
    if(vectors[i].geometry.intersects(point)){
       alert(vectors[i].attributes['name']);
    }
}

或者您可以使用https://github.com/maxogden/geojson-js-utils，这是一个更具体的库。看起来它知道如何阅读GeoJSON并且它有一个方法gju.pointInPolygon。我没有测试过它。

LatLong属于D3 + Leaflet中的给定多边形

1 个答案: