diff options
| author | ivanshen <iwshen11@gmail.com> | 2019-03-05 21:39:35 +0000 |
|---|---|---|
| committer | ivanshen <iwshen11@gmail.com> | 2019-03-05 21:39:35 +0000 |
| commit | 3b36b1ad459ee739a87a32a18bb5846770125bec (patch) | |
| tree | 259c5173be1992fdcf053d80fdcccb200c4bc903 /web/public/javascripts/map.js | |
| parent | 9f5447a54ba8bbbcc271035d180822efedce6670 (diff) | |
modularize plot points
Diffstat (limited to 'web/public/javascripts/map.js')
| -rw-r--r-- | web/public/javascripts/map.js | 32 |
1 files changed, 14 insertions, 18 deletions
diff --git a/web/public/javascripts/map.js b/web/public/javascripts/map.js index 5739dec..2547780 100644 --- a/web/public/javascripts/map.js +++ b/web/public/javascripts/map.js @@ -3,6 +3,18 @@ // attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' // }).addTo(map); +function plotPointsOnMap(points) { + L.geoJson(points, { + pointToLayer: function (feature, latlng) { + //return L.circleMarker(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) +} + // different basemap L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner-lite/{z}/{x}/{y}{r}.{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> — Map data © <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors', @@ -11,15 +23,7 @@ L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner-lite/{z}/{x}/{y}{r} maxZoom: 18, ext: 'png' }).addTo(map); -L.geoJson(points, { - pointToLayer: function (feature, latlng) { - //return L.circleMarker(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) +plotPointsOnMap(points); if (!!window.EventSource) { var source = new EventSource('/stream'); @@ -27,15 +31,7 @@ if (!!window.EventSource) { var data = JSON.parse(e.data); if (data.coordinates) { points.push(data); - L.geoJson(points, { - pointToLayer: function (feature, latlng) { - //return L.circleMarker(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) + plotPointsOnMap(points); } }, false) |
