kawaiipunk/cotech-website
0
0
Fork 0
forked from autonomic-cooperative/cotech-website
Code Pull Requests Activity

Fix bug with map display issue until resize

Browse Source 
As the map tab is created hidden by default, leaflet seems unable
to deal with the sizing properly initially, but we can hook into
the "tab changed" event, and tell leaflet to recalculate the size
after switching tabs
This commit is contained in:
Nick Sellen 2020-08-20 11:53:58 +02:00
parent 4255eb049e
commit d634816ef5
No known key found for this signature in database
GPG Key ID: 7C3A275C0DC2EFA1
3 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
_layouts/service.html
View File

@ -70,11 +70,12 @@
]; ];
$(document).ready(function() { $(document).ready(function() {
window.app.createMapMultiMarker('map-services', 54.7, -4.2, 6, mapEntries); var map = window.app.createMapMultiMarker('map-services', 54.7, -4.2, 6, mapEntries);
$('#coops-view-tabs').on('change.zf.tabs', function() {
map.invalidateSize();
});
}); });
// TODO fix bug with tiles not displaying properly until window resized
</script> </script>
</div> </div>
</div> </div>

7
_layouts/technology.html
View File

@ -70,11 +70,12 @@
]; ];
$(document).ready(function() { $(document).ready(function() {
window.app.createMapMultiMarker('map-technologies', 54.7, -4.2, 6, mapEntries); var map = window.app.createMapMultiMarker('map-technologies', 54.7, -4.2, 6, mapEntries);
$('#coops-view-tabs').on('change.zf.tabs', function() {
map.invalidateSize();
});
}); });
// TODO fix bug with tiles not displaying properly until window resized
</script> </script>
</div> </div>
</div> </div>

2
assets/js/app.js
View File

@ -34,6 +34,7 @@ app.createMapSingleMarker = function(mapId, lat, lng, zoom, markerText) {
var marker = L.marker([lat - 0.0005, lng]).addTo(myMap); var marker = L.marker([lat - 0.0005, lng]).addTo(myMap);
marker.bindPopup(markerText).openPopup(); marker.bindPopup(markerText).openPopup();
} }
return window.app.map;
} }
app.createMapMultiMarker = function(mapId, lat, lng, zoom, markersArray) { app.createMapMultiMarker = function(mapId, lat, lng, zoom, markersArray) {
@ -48,6 +49,7 @@ app.createMapMultiMarker = function(mapId, lat, lng, zoom, markersArray) {
marker.bindPopup(markerVar.markerText); marker.bindPopup(markerVar.markerText);
}); });
} }
return window.app.map;
}; };
//# sourceMappingURL=app.js.map //# sourceMappingURL=app.js.map