mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-06-27 15:53:14 +00:00
Code Issues Releases Wiki Activity

Add startPosition and layersPanel attributes to geomap widget

Browse Source
This commit is contained in:
jeremy@jermolene.com 2023-05-31 09:37:44 +01:00
parent d785fa4c03
commit 463f0cd983
3 changed files with 36 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
editions/geospatialdemo/tiddlers/HelloThere.tid
View File

@ -21,6 +21,7 @@ This demo requires that the API keys needed to access external services be obtai
<$geomap
state=<<qualify "$:/state/demo-map">>
startPosition="bounds"
>
<$list filter="[all[tiddlers+shadows]tag[$:/tags/GeoBaseLayer]]">
<$geobaselayer title=<<currentTiddler>>/>

2
plugins/tiddlywiki/geospatial/docs/geomap.tid
View File

@ -10,6 +10,8 @@ The following attributes are supported:
|!Attribute |!Description |
|''state'' |The title of a state tiddler used to track the state of the map in the `zoom`, `long` and `lat` fields |
|''startPosition'' |Optional starting position for the map: "world" (the default) shows the entire map, "bounds" zooms to the bounds of the loaded layes |
|''layersPanel'' |Optional starting status for the layers panel: "collapsed" (the default) causes the layers panel to initially be shown collapsed, "open" causes the layers panel to initially be shown opened |
If no base layers are defined by `<$geobaselayer>` widgets within the `<$geomap>` widget then all the available base layers will be loaded by the equivalent of the following code:

46
plugins/tiddlywiki/geospatial/widgets/geomap.js
View File

@ -99,12 +99,10 @@ GeomapWidget.prototype.refreshMap = function() {
self.map.removeLayer(layer.layer);
});
this.renderedLayers = []; // Array of {name:,layer:}
$tw.utils.each(this.renderedBaseLayers,function(baseLayer) {
self.map.removeLayer(baseLayer.layer);
});
this.renderedBaseLayers = []; // Array of {name:,layer:}
// Restore the saved map position and zoom level
if(!this.setMapView()) {
// If there was no saved position then default to showing the whole world
this.map.fitWorld();
}
// Create default icon
var iconProportions = 365/560,
iconHeight = 50;
@ -219,8 +217,29 @@ GeomapWidget.prototype.refreshMap = function() {
overlayLayers[layer.name] = layer.layer;
});
this.layerControl = $tw.Leaflet.control.layers(baseLayers,overlayLayers,{
collapsed: true
collapsed: this.geomapLayersPanel !== "open"
}).addTo(this.map);
// Restore the saved map position and zoom level
if(!this.setMapView()) {
// If there was no saved position then look at the startPosition attribute
switch(this.geomapStartPosition) {
case "bounds":
var bounds = null;
$tw.utils.each(this.renderedLayers,function(layer) {
var featureBounds = layer.layer.getBounds();
if(bounds) {
bounds.extend(featureBounds);
} else {
bounds = featureBounds;
}
});
this.map.fitBounds(bounds);
break;
default:
this.map.fitWorld();
break;
}
}
};
/*
@ -240,6 +259,8 @@ Compute the internal state of the widget
*/
GeomapWidget.prototype.execute = function() {
this.geomapStateTitle = this.getAttribute("state");
this.geomapStartPosition = this.getAttribute("startPosition");
this.geomapLayersPanel = this.getAttribute("layersPanel");
};
/*
@ -247,17 +268,16 @@ Selectively refreshes the widget if needed. Returns true if the widget or any of
*/
GeomapWidget.prototype.refresh = function(changedTiddlers) {
var changedAttributes = this.computeAttributes();
// Set zoom and position if the state tiddler has changed
if(changedAttributes.state) {
this.geomapStateTitle = this.getAttribute("state");
}
if(changedAttributes.state || changedTiddlers[this.geomapStateTitle]) {
this.setMapView();
}
// Refresh child nodes, and rerender map if there have been any changes
var result = this.contentRoot.refresh(changedTiddlers);
if(result) {
this.refreshMap();
} else {
// If we're not doing a full refresh, reset the position if the state tiddler has changed
if(changedAttributes.state || changedTiddlers[this.geomapStateTitle]) {
this.geomapStateTitle = this.getAttribute("state");
this.setMapView();
}
}
return result;
};