zoom out more on mobile

Mobile screens are likely narrower (portrait) so zooming out a little more shows an equivalent width for the Australian continent.
This commit is contained in:
Hugh Rundle 2021-01-24 17:00:28 +11:00
parent f6839d7aef
commit ae5c04c533

View file

@ -13,6 +13,8 @@ const mechanics = fetch('data/mechanics_institute_locations.csv')
const nslaBranches = fetch('data/nsla_library_locations.csv') const nslaBranches = fetch('data/nsla_library_locations.csv')
.then( response => response.text()); .then( response => response.text());
var isSmallScreen = window.screen.availWidth < 800;
Promise.all([boundaries, branchesCsv, ikcCsv, mechanics, nslaBranches]) Promise.all([boundaries, branchesCsv, ikcCsv, mechanics, nslaBranches])
.then( data => { .then( data => {
// add tile layer from OSM // add tile layer from OSM
@ -37,7 +39,7 @@ Promise.all([boundaries, branchesCsv, ikcCsv, mechanics, nslaBranches])
// attach map to #mapid div above and centre // attach map to #mapid div above and centre
const map = L.map('mapid', { const map = L.map('mapid', {
center: [-27.00, 133.000], center: [-27.00, 133.000],
zoom: 5, zoom: isSmallScreen ? 4 : 5,
layers: [baseMap] layers: [baseMap]
}); });
@ -320,7 +322,6 @@ Promise.all([boundaries, branchesCsv, ikcCsv, mechanics, nslaBranches])
} }
// add control layers // add control layers
var isSmallScreen = window.screen.availWidth < 800;
var mapControl = L.control.layers( var mapControl = L.control.layers(
baseMaps, baseMaps,
overlayMaps, overlayMaps,