diff options
| author | Your Name <you@example.com> | 2019-06-18 11:16:51 +0200 |
|---|---|---|
| committer | Your Name <you@example.com> | 2019-06-18 11:16:51 +0200 |
| commit | 30f32e4804172092673710c41e1d4082f703b573 (patch) | |
| tree | f49e01c837271cf5212e8f1a2542a2ce991708b2 /un_moteur_a_bukavu | |
| parent | 48449d455df9b2e7b3207a22aa49c1b8fbbb5e62 (diff) | |
| download | hacklab.brussels-30f32e4804172092673710c41e1d4082f703b573.tar.gz | |
playing with maps & content
Diffstat (limited to 'un_moteur_a_bukavu')
| -rw-r--r-- | un_moteur_a_bukavu/index.html | 127 |
1 files changed, 127 insertions, 0 deletions
diff --git a/un_moteur_a_bukavu/index.html b/un_moteur_a_bukavu/index.html new file mode 100644 index 0000000..cdd9c13 --- /dev/null +++ b/un_moteur_a_bukavu/index.html @@ -0,0 +1,127 @@ +<!DOCTYPE html> +<html lang="en" dir="ltr"> + <head> + <meta charset="utf-8"> + <title></title> + <link rel="stylesheet" href="hackmap.css"> + <link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" + integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA==" + crossorigin=""/> + + <script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js" + crossorigin=""></script> + </head> + <body> + <div id="map" style="width:100vw; height:50vh"> + + </div> + <div id="story" style=""> + +<p>mercury 6pk, coming from buratinas, stored in rue loquenghien (jan van loquenghien), repaired at hacklab <loc position="50.87286710651607, 4.377062022686005"> , maybe sold off and transported to bukavu <loc position="-2.5106, 28.8439">, to do the rounds on the lakes there.</p> + + + </div> + </body> + <script type="text/javascript"> + + + + + +function Utils() { + +} + +Utils.prototype = { + constructor: Utils, + isElementInView: function (element, fullyInView) { + var pageTop = $(window).scrollTop(); + var pageBottom = pageTop + $(window).height(); + var elementTop = $(element).offset().top; + var elementBottom = elementTop + $(element).height(); + + if (fullyInView === true) { + return ((pageTop < elementTop) && (pageBottom > elementBottom)); + } else { + return ((elementTop <= pageBottom) && (elementBottom >= pageTop)); + } + } +}; + +var Utils = new Utils(); + + + +L.MyMap = L.Map.extend({ +openPopup: function (popup, latlng, options) { +document.getElementById("demo").innerHTML = popup.getContent(); +return this; +} +}); + +L.myMap = function (m) { +return new L.MyMap(m); +}; +var map = L.myMap('map').setView([50.87287, 4.377], 17); + + + + +var Stamen_Toner = L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner/{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', +subdomains: 'abcd', +minZoom: 0, +maxZoom: 20, +ext: 'png' +}).addTo(map) ; + +var elementScrolled = function(evt){ + console.log(evt.target); + + + + +} + +window.onscroll = elementScrolled; + + + + + +var locations = document.querySelectorAll("loc"); +console.log(locations); +var locationLength=locations.length; +var markerArray=[]; + +for(var i=0;i<locationLength; i++) { + position = locations[i].getAttribute("position").split(","); + + var m = L.marker(position); + m.addTo(map); + + markerArray.push(m.getLatLng()); + +} +var bounds = L.latLngBounds(markerArray); +map.fitBounds(bounds, {padding: L.point(20, 20)}); + +var circle = L.circle([50.87286710651607, 4.377062022686005], { +color: 'orangered', +fillColor: 'orangered', +fillOpacity: 1 , +radius: 2 +}).addTo(map); +circle.bindPopup('<iframe src="https://hacklab.brussels"></iframe>'); + + + + + + + </script> + + + + +</html> |