summaryrefslogtreecommitdiff
path: root/hackmap/index.html
blob: 871a6ca409c6630984e8f14c72096dae266ec4e6 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<!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=""/>
    <!-- Make sure you put this AFTER Leaflet's CSS -->
 <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="demo" style="">

    </div>
  </body>
  <script type="text/javascript">

L.MyMap = L.Map.extend({
openPopup: function (popup, latlng, options) {
document.getElementById("demo").innerHTML = popup.getContent();
console.log("meeeh");
return this;
}
});

L.myMap = function (m) {
return new L.MyMap(m);
};
var map = L.myMap('map').setView([50.87287, 4.377], 17);

/* L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);*/

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> &mdash; Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
subdomains: 'abcd',
minZoom: 0,
maxZoom: 20,
ext: 'png'
}).addTo(map) ;

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>');

circle = L.circle([50.884365143500744, 4.3793392181396475], {
color: 'orangered',
fillColor: 'orangered',
fillOpacity: 1 ,
radius: 2
}).addTo(map);
circle.bindPopup('<iframe src="http://www.ooooo.be/techotsukumogami/"></iframe>');

circle = L.circle([50.8286729,4.3385374], {
color: 'orangered',
fillColor: 'orangered',
fillOpacity: 1 ,
radius: 2
}).addTo(map);
circle.bindPopup('<iframe src="https://www.lesteki.be/"></iframe>');

circle = L.circle([50.8324117,4.3216929], {
color: 'orangered',
fillColor: 'orangered',
fillOpacity: 1 ,
radius: 2
}).addTo(map);
circle.bindPopup('<iframe src="https://hsbxl.be/"></iframe>');


  /*L.marker([50.87287, 4.377], { color:"blue" }).addTo(map)
          .bindPopup('<a href="https://hacklab.brussels/" target="_self" >hacklab.brussels</a>');*/

  </script>

</html>