Open 1stgongsin opened 5 years ago
Can it be possible that 'waypoint name' appears?
Yes I think so, try to inspect the layer object you obtain from the loaded event:
var control = L.Control.fileLayerLoad();
control.loader.on('data:loaded', function (event) {
// event.layer gives you access to the layers you just uploaded!
// iterate each point of the layer
// add a popup or something with the layer properties
});
Thank you for reply, leplatrem. Sadly, I don't know about javascript at all. so I can't change the original code.
</docs/index.js>
L.Control.FileLayerLoad.LABEL = '<img class="icon" src="folder.svg" alt="file icon"/>';
control = L.Control.fileLayerLoad({
fitBounds: true,
layerOptions: {
style: style,
pointToLayer: function (data, latlng) {
return L.circleMarker(
latlng,
{ style: style }
);
}
}
});
control.addTo(map);
control.loader.on('data:loaded', function (e) {
var layer = e.layer;
console.log(layer);
});
}
window.addEventListener('load', function () {
initMap();
});
[L.circleMarker] shows waypoint as just red circle. I want waypoint name appear Can you teach me what code should I add to the original index.js ?
Add this to layerOptions
:
layerOptions: {
onEachFeature: function (feature, layer) {
if (feature.properties.name) { layer.bindTooltip(feature.properties.name, { permanent: true }); }
},
// style: style,
Thank you for reply, johnd0e.
I changed code like below. but It's not working
control = L.Control.fileLayerLoad({
fitBounds: true,
layerOptions: {
onEachFeature = function (feature, layer) {
if (feature.properties.name) { layer.bindTooltip(feature.properties.name, { permanent: true });
},
// style: style,
pointToLayer: function (data, latlng) {
return L.circleMarker(
latlng,
{ style: style }
);
}
}
});
control.addTo(map);
There is mistype: change onEachFeature =
to onEachFeature:
It doesn't work either. sorry for bothering syntax error -> Unexpected token ,
control = L.Control.fileLayerLoad({
fitBounds: true,
layerOptions: {
onEachFeature: function (feature, layer) {
if (feature.properties.name) { layer.bindTooltip(feature.properties.name, { permanent: true });
},
// style: style,
pointToLayer: function (data, latlng) {
return L.circleMarker(
latlng,
{ style: style }
);
}
}
});
control = L.Control.fileLayerLoad({
fitBounds: true,
layerOptions: {
onEachFeature: function (feature, layer) {
if (feature.properties.name) { layer.bindTooltip(feature.properties.name, { permanent: true }) };
},
// style: style,
pointToLayer: function (data, latlng) {
return L.circleMarker(latlng, {style: style});
}
}
});
control1 = L.Control.fileLayerLoad({
fitBounds: true,
layerOptions: {
onEachFeature: function (feature, layer) {
layer.bindTooltip(feature.properties.name, { permanent: true })
},
// style: style,
pointToLayer: function (feature, latlng) {
label = String(feature.properties.name); // .bindTooltip can't use straight 'feature.properties.attribute'
return new L.CircleMarker(latlng, {
weight: 0, fillOpacity:0
}).bindTooltip(label, {permanent: true, opacity: 1, direction: 'center',className: 'labelstyle'}).openTooltip();
}
}
});
When loading gpx file, waypoints just appear as circle. Can it be possible that 'waypoint name' appears?