我有这段代码可以加载地图中的所有标记
<script>
var my_json;
var icono;
var map = L.map('map').setView([-24.376224,-65.1149885], 14);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors'
}).addTo(map);
在feature.geometry.distancia中,我得到需要显示的图标。 如果是smallicon或黄色
var smallIcon = new L.Icon({
iconUrl: 'img/marker-icon-blue.png',
iconRetinaUrl: 'img/marker-icon-2x-blue.png',
});
var yellow = new L.Icon({
iconUrl: 'img/marker-icon-yellow.png',
iconRetinaUrl: 'img/marker-icon-2x-yellow.png',
});
在这里,我可以从feature.geometry.distancia中获取值并将其放入变量中。
function onEachFeature(feature, layer) {
//console.log(feature);
var empleado="<p><strong>"+feature.properties.empleado+"</strong><br>";
var fecha=feature.properties.fecha+"<br>";
var hora=feature.properties.hora+"</p>";
icono=feature.geometry.distancia;
var popupT=empleado.concat(fecha,hora);
layer.bindPopup(popupT);
}
我从构建json的php页面获取信息,这可以正常工作。 我尝试做与在功能oneachfeature上所做的相同的操作,但出现错误。 未捕获的ReferenceError:功能未定义
$.getJSON('geojsondata.php', function(data) {
console.log(data);
//var iconoactual=feature.geometry.distancia;
L.geoJson(data, {
pointToLayer: function(feature, latlng) {
//console.log(latlng, feature);
var iconoactual=feature.geometry.distancia;
在这里我得到了值,但是当我分配给图标时出现错误。 leaflet.js:7未捕获的TypeError:无法读取未定义的属性'popupAnchor'
return L.marker(latlng, {
icon: smallIcon
});
},
onEachFeature: onEachFeature
}).addTo(map);
});
我的杰森是
object {2}
type : FeatureCollection
features [1]
0 {3}
type : Feature
geometry {3}
type : Point
coordinates [2]
0 : -65.1489465
1 : -24.38871095
distancia : yellow
properties {10}
empleado : test@gmail.com
fecha : 2019-10-14
hora : 15:16:00
empleadoC : test@gmail.com-2019-10-14-15:16:00
我希望我的图标类型是我的json feature.geometry.distancia中的图标类型。我该怎么做? 希望有人可以帮助我。 最好的问候。
答案 0 :(得分:0)
我这样解决了
L.geoJson(data, {
pointToLayer: function(feature, latlng) {
//console.log(latlng, feature);
var iconoactual=feature.geometry.distancia;
console.log (iconoactual);
if (iconoactual=='yellow'){
return L.marker(latlng, {
icon: yellow
})
} else {
return L.marker(latlng, {
icon: smallIcon
})
}
},
onEachFeature: onEachFeature
}).addTo(map);