Add better labels to main page map.
This commit is contained in:
parent
3758ac21cb
commit
ab595ed3cb
|
@ -18,6 +18,11 @@
|
|||
border: 1px solid black;
|
||||
}
|
||||
#map { height: 250px; }
|
||||
.leaflet-tooltip.my-labels {
|
||||
background-color: transparent;
|
||||
border: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
@ -39,7 +44,7 @@
|
|||
//{{markers|safe}}
|
||||
|
||||
// Show station location
|
||||
var station = L.marker([{{station_lat}}, {{station_lon}}]).addTo(map).bindTooltip('{{station_call}}', permanent=true).openTooltip();
|
||||
var station = L.marker([{{station_lat}}, {{station_lon}}]).addTo(map).bindTooltip('{{station_call}}', {permanent: true}).openTooltip();
|
||||
|
||||
// Show GeoJSON of markers
|
||||
var group = L.geoJSON({{geojs|safe}},
|
||||
|
@ -47,9 +52,25 @@
|
|||
style: function (feature) {
|
||||
return {color: feature.properties.color};
|
||||
}
|
||||
}).bindTooltip(function (layer) {
|
||||
return 'Object '+layer.feature.properties.object_name+' from '+layer.feature.properties.from;
|
||||
}, permanent=true).addTo(map);
|
||||
});
|
||||
|
||||
// group.bindTooltip(function (layer) {
|
||||
// return 'Object '+layer.feature.properties.object_name+' from '+layer.feature.properties.from;
|
||||
// }, {permanent: false}).openTooltip().addTo(map);
|
||||
// Hacked together from https://gis.stackexchange.com/a/246919
|
||||
var pointLayer = L.geoJSON(null, {
|
||||
pointToLayer: function(feature,latlng){
|
||||
//(true condition) ? "true" : "false"
|
||||
label = (feature.properties.object_name === null) ? String(feature.properties.from) : String(feature.properties.object_name)
|
||||
//label = String('Object '+feature.properties.object_name+' from '+feature.properties.from) // Must convert to string, .bindTooltip can't use straight 'feature.properties.attribute'
|
||||
return new L.CircleMarker(latlng, {
|
||||
radius: 1,
|
||||
}).bindTooltip(label, {permanent: true, opacity: 0.7, className: "my-labels"}).openTooltip();
|
||||
}
|
||||
});
|
||||
pointLayer.addData({{geojs|safe}});
|
||||
map.addLayer(pointLayer);
|
||||
|
||||
|
||||
// Zoom to show all
|
||||
map.fitBounds(group.getBounds().pad(0.3));
|
||||
|
|
Loading…
Reference in New Issue
Block a user