使用 Mapbox 和 Nominatim 绘制多条 GeoJSON 线
Drawing multiple GeoJSON lines with Mapbox and Nominatim
当用户在使用 OSM 数据并由 Mapbox 渲染的地图上单击它时,我正在尝试绘制一条街道。我从点击中获取坐标并将它们发送到服务器,然后我 return LineStrings,Nominatim 为特定街道提供。我对较长的街道有疑问:它们似乎不完整(例如 100 米的正确绘制线,然后 100 条街道丢失,然后再次正常绘制的线),一些较长的街道甚至可以由多达 10 或更多细分。在我看来,这个问题可能是因为 osm 的数据不完整(尽管我对此表示怀疑)或者我没有正确地 draw/load 数据。我的代码如下所示:
map.on("click", function(e) {
//get coordinates and send them to the server.
function getRequest() {
return $.ajax({
url: "/street",
data: clickCoords,
});
};
$.when(getRequest()).done(function(response, status, jqXHR) {
streetGEOJSON = response;
var feat = [];
for (var i = 0; i < streetGEOJSON.length; i++) {
feat[i] = {
"type": "Feature",
"geometry": {
"type": "LineString",
"coordinates": streetGEOJSON[i]
}
}
}
var lines = {
"type": "geojson",
"data": {
"type": "FeatureCollection",
"features": feat
}
}
map.addSource("street", lines);
map.addLayer({
"id": "street",
"type": "line",
"source": "street",
"filter": ["==", "$type", "LineString"],
"layout": {
"line-join": "round",
"line-cap": "round"
},
"paint": {
"line-color": "#888",
"line-width": 8
}
});
});
错误绘制的街道示例:http://prntscr.com/erfwhr
也注意到了这一点:http://prntscr.com/erg0r0。
传递给 get 响应的数据可以长达 3000 个或更多字符。我猜这就是问题所在,浏览器不会等待所有坐标..
任何帮助或见解将不胜感激。
如果有人遇到类似问题,我会post回答:)问题不在服务器的请求中,而是在名义上减少搜索结果,所以解决方案是在 get 请求中包含 &dedupe=0提名.
当用户在使用 OSM 数据并由 Mapbox 渲染的地图上单击它时,我正在尝试绘制一条街道。我从点击中获取坐标并将它们发送到服务器,然后我 return LineStrings,Nominatim 为特定街道提供。我对较长的街道有疑问:它们似乎不完整(例如 100 米的正确绘制线,然后 100 条街道丢失,然后再次正常绘制的线),一些较长的街道甚至可以由多达 10 或更多细分。在我看来,这个问题可能是因为 osm 的数据不完整(尽管我对此表示怀疑)或者我没有正确地 draw/load 数据。我的代码如下所示:
map.on("click", function(e) {
//get coordinates and send them to the server.
function getRequest() {
return $.ajax({
url: "/street",
data: clickCoords,
});
};
$.when(getRequest()).done(function(response, status, jqXHR) {
streetGEOJSON = response;
var feat = [];
for (var i = 0; i < streetGEOJSON.length; i++) {
feat[i] = {
"type": "Feature",
"geometry": {
"type": "LineString",
"coordinates": streetGEOJSON[i]
}
}
}
var lines = {
"type": "geojson",
"data": {
"type": "FeatureCollection",
"features": feat
}
}
map.addSource("street", lines);
map.addLayer({
"id": "street",
"type": "line",
"source": "street",
"filter": ["==", "$type", "LineString"],
"layout": {
"line-join": "round",
"line-cap": "round"
},
"paint": {
"line-color": "#888",
"line-width": 8
}
});
});
也注意到了这一点:http://prntscr.com/erg0r0。 传递给 get 响应的数据可以长达 3000 个或更多字符。我猜这就是问题所在,浏览器不会等待所有坐标..
任何帮助或见解将不胜感激。
如果有人遇到类似问题,我会post回答:)问题不在服务器的请求中,而是在名义上减少搜索结果,所以解决方案是在 get 请求中包含 &dedupe=0提名.