返回最近的特征(json)多边形的标题使用传单JS

Return Title of Closest Feature (json) Polygon using Leaflet JS

本文关键字:JS 标题 特征 最近 json 返回 多边形      更新时间:2023-09-26

我有四个json格式的轮廓(特征),在传单地图上显示为多边形。目前我显示我的当前位置时,单击L.Control.Locate箭头。它显示我在多边形附近,然而,我想知道我最接近哪个多边形(通过标题),并有一个警告或至少一个变量告诉我最近的标题。

使用最近的https://github.com/mapbox/leaflet-knn,我不清楚如何得到最近的点。我创建了一个小函数:

function nearBy(latlng){
    //does nearBy() have the latlng? This does show me the latlng of the user
    alert(latlng);
    //pass in all the data
    var gj = L.geoJson(GEOJSON_DATA);
    //do the knn magics
    var index = leafletKnn(gj).nearest(L.latLng(latlng), 5);
    //show me something
    alert(index);
}

alert(index) is speting out: [object object],[object object],[object object],[object object],[object object],[object object]

…这很好,因为它显示了一些东西在那里,然而,我不能得到任何其他的东西。

有人像我一样使用传单吗?

…编辑……Json是这样的(下面不完整):

{ "type": "Feature", "properties": { "Name": "<a href='framework/index.html'><h3>Conecuh National Forest</h3></a>", "description": "<html xmlns:fo='"http:'/'/www.w3.org'/1999'/XSL'/Format'" xmlns:msxsl='"urn:schemas-microsoft-com:xslt'">'n'n<head>'n'n<META http-equiv='"Content-Type'" content='"text'/html'">'n'n<meta http-equiv='"content-type'" content='"text'/html; charset=UTF-8'">'n'n<'/head>'n'n<body style='"margin:0px 0px 0px 0px;overflow:auto;background:#FFFFFF;'">'n'n<table style='"font-family:Arial,Verdana,Times;font-size:12px;text-align:left;width:100%;border-collapse:collapse;padding:3px 3px 3px 3px'">'n'n<tr style='"text-align:center;font-weight:bold;background:#9CBCE2'">'n'n<td>Conecuh National Forest<'/td>'n'n<'/tr>'n'n<tr>'n'n<td>'n'n<table style='"font-family:Arial,Verdana,Times;font-size:12px;text-align:left;width:100%;border-spacing:0px; padding:3px 3px 3px 3px'">'n'n<tr>'n'n<td>PROCLAIMEDFORESTID<'/td>'n'n<td>295366010328<'/td>'n'n<'/tr>'n'n<tr bgcolor='"#D4E4F3'">'n'n<td>FORESTNAME<'/td>'n'n<td>Conecuh National Forest<'/td>'n'n<'/tr>'n'n<tr>'n'n<td>GIS_ACRES<'/td>'n'n<td>171215.333<'/td>'n'n<'/tr>'n'n<tr bgcolor='"#D4E4F3'">'n'n<td>SHAPE<'/td>'n'n<td>Polygon<'/td>'n'n<'/tr>'n'n<tr>'n'n<td>SHAPE.AREA<'/td>'n'n<td>0.065501<'/td>'n'n<'/tr>'n'n<tr bgcolor='"#D4E4F3'">'n'n<td>SHAPE.LEN<'/td>'n'n<td>1.596221<'/td>'n'n<'/tr>'n'n<'/table>'n'n<'/td>'n'n<'/tr>'n'n<'/table>'n'n<'/body>'n'n<'/html>", "timestamp": null, "begin": null, "end": null, "altitudeMode": null, "tessellate": 1, "extrude": -1, "visibility": -1, "drawOrder": null, "icon": null }, "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ -86.399549, 31.205536, 0.0 ], [ -86.407326, 31.205638, 0.0 ], [ -86.409808, 31.205671, 0.0 ], [ -86.413319, 31.205717, 0.0 ], [ -86.414067, 31.205711, 0.0 ], [ -86.418361, 31.205674, 0.0 ], [ -86.429486, 31.20558, 0.0 ], [ -86.429544, 31.198715, 0.0 ], [ -86.429615, 31.190445, 0.0 ], [ -86.429627, 31.185575, 0.0 ], [ -86.429651, 31.175982, 0.0 ], [ -86.430013, 31.175979, 0.0 ], [ -86.430563, 31.175974, 0.0 ], [ -86.432963, 31.175952, 0.0 ], [ -86.433052, 31.175951, 0.0 ], [ -86.433474, 31.175947, 0.0 ], [ -86.433864, 31.175944, 0.0 ]

…编辑2…

使用FireBug和console.log()我能够得到结果。Leaflet-knn正确返回它们,具有最接近的LatLng(在我的json中)索引[0]。Lat + "," index[0].lon

如果有人有"干净"的方法来做这件事,我仍然想要一些例子…

使用nearestLayer代替nearest:这将返回最近的层而不是最近的点,如文档中指定的。