Leaflet:使用 if 语句在 table 中排序和编辑 geojson 数据
Leaflet: sort and edit geojson data in a table with if-statements
我在 table 中显示 json 数据时遇到问题。我正在制作一张显示数据的地图,该地图通过立交桥-turbo.eu 从 Openstreetmap 直接导出为 geojson 文件。这意味着每个点都有不同的特征。我想在弹出窗口中显示尽可能多的信息,但将不必要的信息保留在 table 之外,而且我希望链接可以点击。到目前为止,这是我的代码,它提供了每个点的基本 table 视图。这是一个演示:http://stefang.cepheus.uberspace.de/stackexample/
function everyPoint (feature, layer){
var popupcontent = [];
for (var prop in feature.properties) {
popupcontent.push("<tr><td>" +prop + ": </td><td>" + feature.properties[prop].replace(";", ", ") + "</td></tr>");
}
var innerTable = popupcontent.join("");
layer.bindPopup(
"<h1>" +feature.properties.name +"</h1>"
+"<table>" +innerTable + "</table>"
+"<p> Old or outdated data? Change it on <a href='http://openstreetmap.org/" +feature.id +"'> on openstreetmap.org</a>.</p>"
);
};
L.geoJson(karlsruhe, {
onEachFeature: everyPoint
}).addTo(map);
我想在这里做三件事:
- 隐藏不必要的数据,基本上是@ID,Shop:Farm
- 将 URL 切换为超链接,主要是网站和 contact.website
- 在 table
中将其他所有内容显示为文本
我试图用一个简单的 if 语句解决这个问题,但只有 else 块运行:
var popupcontent = [];
for (var prop in feature.properties) {
if (prop == "id" ){
//do nothing
}
else if (prop == "website"){
popupcontent.push("<tr><td>" +prop + ": </td><td>" + "<a link href='" + feature.properties[prop] + "'></a></td></tr>");
}
else {
popupcontent.push("<tr><td>" +prop + ": </td><td>" + feature.properties[prop].replace(";", ", ") + "</td></tr>");
}
}
我认为 if 函数中的语句有问题,但我无法弄清楚。感谢您的帮助:)
我找到了解决方案,只是一些错别字加上 link 中没有文字:
var popupcontent = [];
for (var prop in feature.properties) {
if (prop == "@id" ){
//do nothing
}
else if (prop == "website"){
popupcontent.push("<tr><td>" +prop + ": </td><td>" + "<a link href='" + feature.properties[prop] + "'>" +feature.properties[prop] +"</a></td></tr>");
}
else {
popupcontent.push("<tr><td>" +prop + ": </td><td>" + feature.properties[prop].replace(";", ", ") + "</td></tr>");
}
}
我在 table 中显示 json 数据时遇到问题。我正在制作一张显示数据的地图,该地图通过立交桥-turbo.eu 从 Openstreetmap 直接导出为 geojson 文件。这意味着每个点都有不同的特征。我想在弹出窗口中显示尽可能多的信息,但将不必要的信息保留在 table 之外,而且我希望链接可以点击。到目前为止,这是我的代码,它提供了每个点的基本 table 视图。这是一个演示:http://stefang.cepheus.uberspace.de/stackexample/
function everyPoint (feature, layer){
var popupcontent = [];
for (var prop in feature.properties) {
popupcontent.push("<tr><td>" +prop + ": </td><td>" + feature.properties[prop].replace(";", ", ") + "</td></tr>");
}
var innerTable = popupcontent.join("");
layer.bindPopup(
"<h1>" +feature.properties.name +"</h1>"
+"<table>" +innerTable + "</table>"
+"<p> Old or outdated data? Change it on <a href='http://openstreetmap.org/" +feature.id +"'> on openstreetmap.org</a>.</p>"
);
};
L.geoJson(karlsruhe, {
onEachFeature: everyPoint
}).addTo(map);
我想在这里做三件事:
- 隐藏不必要的数据,基本上是@ID,Shop:Farm
- 将 URL 切换为超链接,主要是网站和 contact.website
- 在 table 中将其他所有内容显示为文本
我试图用一个简单的 if 语句解决这个问题,但只有 else 块运行:
var popupcontent = [];
for (var prop in feature.properties) {
if (prop == "id" ){
//do nothing
}
else if (prop == "website"){
popupcontent.push("<tr><td>" +prop + ": </td><td>" + "<a link href='" + feature.properties[prop] + "'></a></td></tr>");
}
else {
popupcontent.push("<tr><td>" +prop + ": </td><td>" + feature.properties[prop].replace(";", ", ") + "</td></tr>");
}
}
我认为 if 函数中的语句有问题,但我无法弄清楚。感谢您的帮助:)
我找到了解决方案,只是一些错别字加上 link 中没有文字:
var popupcontent = [];
for (var prop in feature.properties) {
if (prop == "@id" ){
//do nothing
}
else if (prop == "website"){
popupcontent.push("<tr><td>" +prop + ": </td><td>" + "<a link href='" + feature.properties[prop] + "'>" +feature.properties[prop] +"</a></td></tr>");
}
else {
popupcontent.push("<tr><td>" +prop + ": </td><td>" + feature.properties[prop].replace(";", ", ") + "</td></tr>");
}
}