diff options
| -rw-r--r-- | web/public/javascripts/map.js | 15 |
1 files changed, 12 insertions, 3 deletions
diff --git a/web/public/javascripts/map.js b/web/public/javascripts/map.js index 4b8b8f3..5b196d9 100644 --- a/web/public/javascripts/map.js +++ b/web/public/javascripts/map.js @@ -7,12 +7,16 @@ function plotPointsOnMap(points) { L.geoJson(points, { pointToLayer: function (feature, latlng) { //return L.circleMarker(latlng); + latlngbounds.extend(latlng); return L.marker(latlng); } }).bindPopup(function (layer) { // layer.feature.geometry gives you access to all the fields return "<p>" + JSON.stringify(layer.feature.geometry) + "</p>"; }).addTo(map) + + // rezoom the map so that all the markers fit in the view + map.fitBounds(latlngbounds); } // different basemap @@ -23,10 +27,15 @@ L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner-lite/{z}/{x}/{y}{r} maxZoom: 18, ext: 'png' }).addTo(map); + +// keep track of the boundary of the markers so that we can update the +// map to fit them all +var latlngbounds = new L.latLngBounds(); + plotPointsOnMap(points); if (window.EventSource) { var source = new EventSource('/stream'); - + source.addEventListener('message', function(e) { var data = JSON.parse(e.data); if (data.coordinates) { @@ -34,11 +43,11 @@ if (window.EventSource) { plotPointsOnMap(points); } }, false) - + source.addEventListener('open', function(e) { console.log("Connection was opened") }, false) - + source.addEventListener('error', function(e) { if (e.readyState == EventSource.CLOSED) { console.log("Connection was closed") |