mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-12-26 18:10:27 +00:00
Add startPosition and layersPanel attributes to geomap widget
This commit is contained in:
parent
d785fa4c03
commit
463f0cd983
@ -21,6 +21,7 @@ This demo requires that the API keys needed to access external services be obtai
|
|||||||
|
|
||||||
<$geomap
|
<$geomap
|
||||||
state=<<qualify "$:/state/demo-map">>
|
state=<<qualify "$:/state/demo-map">>
|
||||||
|
startPosition="bounds"
|
||||||
>
|
>
|
||||||
<$list filter="[all[tiddlers+shadows]tag[$:/tags/GeoBaseLayer]]">
|
<$list filter="[all[tiddlers+shadows]tag[$:/tags/GeoBaseLayer]]">
|
||||||
<$geobaselayer title=<<currentTiddler>>/>
|
<$geobaselayer title=<<currentTiddler>>/>
|
||||||
|
@ -10,6 +10,8 @@ The following attributes are supported:
|
|||||||
|
|
||||||
|!Attribute |!Description |
|
|!Attribute |!Description |
|
||||||
|''state'' |The title of a state tiddler used to track the state of the map in the `zoom`, `long` and `lat` fields |
|
|''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:
|
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:
|
||||||
|
|
||||||
|
@ -99,12 +99,10 @@ GeomapWidget.prototype.refreshMap = function() {
|
|||||||
self.map.removeLayer(layer.layer);
|
self.map.removeLayer(layer.layer);
|
||||||
});
|
});
|
||||||
this.renderedLayers = []; // Array of {name:,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:}
|
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
|
// Create default icon
|
||||||
var iconProportions = 365/560,
|
var iconProportions = 365/560,
|
||||||
iconHeight = 50;
|
iconHeight = 50;
|
||||||
@ -219,8 +217,29 @@ GeomapWidget.prototype.refreshMap = function() {
|
|||||||
overlayLayers[layer.name] = layer.layer;
|
overlayLayers[layer.name] = layer.layer;
|
||||||
});
|
});
|
||||||
this.layerControl = $tw.Leaflet.control.layers(baseLayers,overlayLayers,{
|
this.layerControl = $tw.Leaflet.control.layers(baseLayers,overlayLayers,{
|
||||||
collapsed: true
|
collapsed: this.geomapLayersPanel !== "open"
|
||||||
}).addTo(this.map);
|
}).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() {
|
GeomapWidget.prototype.execute = function() {
|
||||||
this.geomapStateTitle = this.getAttribute("state");
|
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) {
|
GeomapWidget.prototype.refresh = function(changedTiddlers) {
|
||||||
var changedAttributes = this.computeAttributes();
|
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
|
// Refresh child nodes, and rerender map if there have been any changes
|
||||||
var result = this.contentRoot.refresh(changedTiddlers);
|
var result = this.contentRoot.refresh(changedTiddlers);
|
||||||
if(result) {
|
if(result) {
|
||||||
this.refreshMap();
|
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;
|
return result;
|
||||||
};
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user