From 712c6ea61bfa734875083a0b24098c63a98c791a Mon Sep 17 00:00:00 2001 From: fmonge Date: Mon, 6 Feb 2017 13:21:20 -0600 Subject: [PATCH] osm plugin --- maps/index.html | 114 ---------------------------------------- osm/index.html | 42 +++++++++++++++ osm/plugin.js | 48 +++++++++++++++++ {maps => osm}/popup.png | Bin 4 files changed, 90 insertions(+), 114 deletions(-) delete mode 100644 maps/index.html create mode 100644 osm/index.html create mode 100644 osm/plugin.js rename {maps => osm}/popup.png (100%) diff --git a/maps/index.html b/maps/index.html deleted file mode 100644 index dc3675d..0000000 --- a/maps/index.html +++ /dev/null @@ -1,114 +0,0 @@ - - - - - - - - - - - - - -
- - - - - \ No newline at end of file diff --git a/osm/index.html b/osm/index.html new file mode 100644 index 0000000..f8ea9ed --- /dev/null +++ b/osm/index.html @@ -0,0 +1,42 @@ + + + + + + + + + + + + +
+ + + + + \ No newline at end of file diff --git a/osm/plugin.js b/osm/plugin.js new file mode 100644 index 0000000..02e755b --- /dev/null +++ b/osm/plugin.js @@ -0,0 +1,48 @@ +'use strict' + +function mapPlugin(data){ + + mapboxgl.accessToken = 'pk.eyJ1IjoiZmFmYWJhIiwiYSI6ImNpeWpwMzd3ZDAwMDMycXM3YXdlZ3licHEifQ.XJU54ySPMKfOLLK8qo2QFA' //public key - mapbox + + var popup = '', + div = '', + info = '', + lat = '', + lon = '' + + var map = new mapboxgl.Map({ + container: 'map', + style: 'mapbox://styles/mapbox/streets-v9', + zoom: data.length > 1 ? 6: 15 + }) + + // radio + var layerList = document.getElementById('menu'), + inputs = layerList.getElementsByTagName('input') + + for (var i = 0; i < inputs.length; i++) + inputs[i].onclick = switchLayer + + for (row of data) { + lon = row.location_longitude, + lat = row.location_latitude, + info = `${row.ip} / ${row.hostname}` + popup = new mapboxgl.Popup({offset: 39}) + .setText( info ) + div = document.createElement('div') + div.id = 'marker' + + new mapboxgl.Marker(div, {offset:[-25, -50]}) + .setLngLat([lon,lat]) + .setPopup(popup) + .addTo(map) + } + + map.setCenter([lon, lat]) + + function switchLayer(layer) + { + var layerId = layer.target.id + map.setStyle(`mapbox://styles/mapbox/${layerId}-v9`) + } +} \ No newline at end of file diff --git a/maps/popup.png b/osm/popup.png similarity index 100% rename from maps/popup.png rename to osm/popup.png