0

genPOI: support polylines and filled-in polygons

Add support for polyline POIs just like in the good ol'
Google Maps days. See #883.

The format after this commit is:
{ id, x, y, z, text, color, polyline/polygon: [{ x, y, z }, ...] }

Optional properties:
- common ones like "icon" and "hovertext"
- "strokeColor" (string),
- "fill" (boolean)
- "weight" (integer)

Docs not included.

Largely based on PR #1536 by @jsmienk.
Closes #1456, closes #1536, closes #1643.
This commit is contained in:
Nikita Litvin
2019-09-25 05:21:09 +03:00
parent 2b699d0355
commit a3b9493c57
3 changed files with 64 additions and 26 deletions

View File

@@ -378,27 +378,48 @@ overviewer.util = {
console.log("this tileset has markers:", obj);
obj.marker_groups = {};
// For every group of markers
for (var mkidx = 0; mkidx < markers[obj.path].length; mkidx++) {
// Create a Leaflet layer group
var marker_group = new L.layerGroup();
var marker_entry = markers[obj.path][mkidx];
L.Util.setOptions(marker_group, {default_checked: marker_entry.checked});
var icon = L.divIcon({html: `<img class="ov-marker" src="${marker_entry.icon}">`});
// For every marker in group
for (var dbidx = 0; dbidx < markersDB[marker_entry.groupName].raw.length; dbidx++) {
var db = markersDB[marker_entry.groupName].raw[dbidx];
var latlng = overviewer.util.fromWorldToLatLng(db.x, db.y, db.z, obj);
var m_icon;
if (db.icon != undefined) {
m_icon = L.divIcon({html: `<img class="ov-marker" src="${db.icon}">`});
let db = markersDB[marker_entry.groupName].raw[dbidx];
var layerObj = undefined;
// Shape or marker?
if ('points' in db) {
// Convert all coords
plLatLng = db['points'].map(function(p) {
return overviewer.util.fromWorldToLatLng(p.x, p.y, p.z, obj);
});
options = {
color: db['strokeColor'],
weight: db['strokeWeight'],
fill: db['fill']
};
layerObj = db['isLine'] ? L.polyline(plLatLng, options) : L.polygon(plLatLng, options);
// TODO: add other config options (fill color, fill opacity)
} else {
m_icon = icon;
// Convert coords
let latlng = overviewer.util.fromWorldToLatLng(db.x, db.y, db.z, obj);
// Set icon and use default icon if not specified
let m_icon = L.divIcon({html: `<img class="ov-marker" src="${db.icon == undefined ? marker_entry.icon : db.icon}">`});
// Create marker
layerObj = new L.marker(latlng, {icon: m_icon, title: db.hovertext});
}
let new_marker = new L.marker(latlng, {icon: m_icon, title: db.hovertext});
// Add popup to marker
if (marker_entry.createInfoWindow) {
new_marker.bindPopup(db.text);
layerObj.bindPopup(db.text);
}
marker_group.addLayer(new_marker);
// Add the polyline or marker to the layer
marker_group.addLayer(layerObj);
}
// Save marker group
obj.marker_groups[marker_entry.displayName] = marker_group;
}
}