Skip to content

Commit

Permalink
Merge pull request #537 from kabalin/maps-zoom
Browse files Browse the repository at this point in the history 
Maps zooms review and improvements
  • Loading branch information
@kabalin
kabalin authored Dec 21, 2022
2 parents c93d124 + 0fbcb44 commit 7453bfa
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 33 deletions.
58 changes: 26 additions & 32 deletions public/js/module/map/map.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -135,19 +135,18 @@ define([

/* Define map types (layers).
*
* For fixed max zoom: specify maxZoom in TileLayer and in
* type object. It will be possible to zoom map up to maxZoom
* value.
* For fixed max zoom: specify maxZoom in TileLayer. It
* will be possible to zoom map up to maxZoom value.
*
* For "overzoom", set maxNativeZoom in TileLayer, and maxZoom
* in both TileLayer and in type object. It will be possible to
* zoom map up to maxZoom value. Layer will be "stretched" if
* current zoom is above maxNativeZoom.
* For "overzoom", set maxNativeZoom and maxZoom in
* TileLayer. It will be possible to zoom map up to
* maxZoom value. Layer will be "stretched" if current
* zoom is above maxNativeZoom.
*
* For switching layer, set maxNativeZoom in TileLayer, and maxZoom
* in both TileLayer and in type object. Set limitZoom in type
* object. It will be possible to zoom map up to maxZoom value.
* When current zoom > limitZoom, map will switch to maxAfter
* For switching layer, set maxNativeZoom and maxZoom in
* TileLayer type object. Set limitZoom in type object. It
* will be possible to zoom map up to maxZoom value. When
* current zoom > limitZoom, map will switch to maxAfter
* layer, keeping current zoom value. maxAfter value
* format is "<sys id>.<type id>", e.g. 'osm.mapnik'.
*/
Expand All @@ -161,7 +160,6 @@ define([
maxZoom: 18,
maxNativeZoom: 17,
}),
maxZoom: 18,
limitZoom: 17,
maxAfter: 'osm.mapnik',
},
Expand All @@ -172,9 +170,9 @@ define([
obj: new L.TileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; участники сообщества <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
updateWhenIdle: false,
maxZoom: 19,
maxZoom: 20,
maxNativeZoom: 19,
}),
maxZoom: 19,
},
{
id: 'mapnik_de',
Expand All @@ -186,7 +184,6 @@ define([
maxNativeZoom: 18,
attribution: 'OSM Deutsch | &copy; участники сообщества <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
}),
maxZoom: 19,
limitZoom: 18,
maxAfter: 'osm.mapnik',
},
Expand All @@ -200,7 +197,6 @@ define([
maxNativeZoom: 18,
attribution: 'OSM Française | &copy; участники сообщества <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
}),
maxZoom: 19,
limitZoom: 18,
maxAfter: 'osm.mapnik',
},
Expand All @@ -214,7 +210,6 @@ define([
maxNativeZoom: 17,
attribution: '&copy; участники сообщества <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> | <a href="http://viewfinderpanoramas.org">SRTM</a> | Стиль карты: &copy; <a href="https://opentopomap.org">OpenTopoMap</a> (<a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a>)',
}),
maxZoom: 18,
limitZoom: 17,
maxAfter: 'osm.mapnik',
},
Expand All @@ -225,11 +220,11 @@ define([
obj: new L.TileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner/{z}/{x}/{y}.{ext}', {
attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> | &copy; участники сообщества <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
subdomains: 'abcd',
maxZoom: 20,
maxZoom: 19,
maxNativeZoom: 18,
ext: 'png',
updateWhenIdle: false,
}),
maxZoom: 20,
},
]),
});
Expand Down Expand Up @@ -285,7 +280,7 @@ define([
desc: 'Схема',
selected: ko.observable(false),
params: 'map',
maxZoom: 20,
maxZoom: 21,
},
{
id: 'sat',
Expand Down Expand Up @@ -320,7 +315,6 @@ define([
maxZoom: 20,
maxNativeZoom: 19,
}),
maxZoom: 20,
},
{
id: 'mtb',
Expand All @@ -332,7 +326,6 @@ define([
maxZoom: 19,
maxNativeZoom: 18,
}),
maxZoom: 19,
limitZoom: 18,
maxAfter: 'osm.mapnik',
},
Expand All @@ -347,8 +340,6 @@ define([
maxZoom: 19,
maxNativeZoom: 17,
}),
maxZoom: 19,
minZoom: 9,
},
]),
});
Expand Down Expand Up @@ -531,7 +522,8 @@ define([
container: '.mapNavigation',
options: {
map: this.map,
maxZoom: this.layerActive().type.limitZoom || this.layerActive().type.maxZoom,
maxZoom: this.layerActive().type.limitZoom || this.map.getMaxZoom() || defaults.maxZoom,
minZoom: this.map.getMinZoom() || defaults.minZoom,
canOpen: !this.embedded,
},
ctx: this,
Expand Down Expand Up @@ -882,22 +874,24 @@ define([
const setLayer = function (type) {
this.map.addLayer(type.obj);
this.markerManager.layerChange();
this.map.options.maxZoom = type.maxZoom;
this.map.options.minZoom = type.minZoom || defaults.minZoom;
// Set maxZoom and minZoom as defined in TileLayer object, otherwise use defaults.
this.map.options.maxZoom = type.obj.options.maxZoom || defaults.maxZoom;
this.map.options.minZoom = type.obj.options.minZoom || defaults.minZoom;

if (this.navSliderVM && Utils.isType('function', this.navSliderVM.recalcZooms)) {
this.navSliderVM.recalcZooms(type.limitZoom || type.maxZoom, true);
// Adjust zoom slider.
this.navSliderVM.recalcZooms(type.limitZoom || this.map.getMaxZoom(), true);
}

// If curent map zoom is out of range of layer settings, adjust accordingly.
const center = this.map.getCenter();

if (type.limitZoom !== undefined && this.map.getZoom() > type.limitZoom) {
this.map.setView(center, type.limitZoom);
} else if (this.map.getZoom() > type.maxZoom) {
this.map.setView(center, type.maxZoom);
} else if (type.minZoom !== undefined && this.map.getZoom() < type.minZoom) {
this.map.setView(center, type.minZoom);
} else if (this.map.getZoom() > this.map.getMaxZoom()) {
this.map.setView(center, this.map.getMaxZoom());
} else if (this.map.getZoom() < this.map.getMinZoom()) {
this.map.setView(center, this.map.getMinZoom());
}

this.setLocalState();
Expand Down
3 changes: 2 additions & 1 deletion public/js/module/map/navSlider.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ define([
return Cliche.extend({
pug: pug,
options: {
minZoom: 3,
maxZoom: 18,
canOpen: true,
},
Expand All @@ -27,7 +28,7 @@ define([
this.sliding = ko.observable(false);

this.step = ko.observable(9);
this.minZoom = ko.observable(0);
this.minZoom = ko.observable(this.options.minZoom);
this.maxZoom = ko.observable(this.options.maxZoom);
this.numZooms = ko.observable(false);
this.sliderOnZoom = ko.observable(this.map.getZoom());
Expand Down

0 comments on commit 7453bfa

Please sign in to comment.