-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
122 lines (117 loc) · 6.11 KB
/
index.html
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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<!-- Julien Muggli - 2019 -->
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description"
content="Drone map helper vous permet de parcourir les différents éléments importants à savoir avant de faire voler son drone. Afin de vous offrir la meilleure expérience possible, merci de
désactiver vos bloqueurs de publicités pour cette application, cette ils peuvent empêcher le chargement de certaines données. Vous pouvez combiner plusieurs couches afin de voir où se trouvent les
zones interdites de vol ainsi que les conditions météorologiques. Par défaut, les couches interactives sont activées." />
<meta name="keywords" content="drone, map, help, helper, swiss, suisse, carte drone, ofac, aeronautique" />
<meta name="author" content="Julien Muggli" />
<title>Drone map helper</title>
<link rel="apple-touch-icon" sizes="57x57" href="/favicon/apple-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="60x60" href="/favicon/apple-icon-60x60.png" />
<link rel="apple-touch-icon" sizes="72x72" href="/favicon/apple-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="76x76" href="/favicon/apple-icon-76x76.png" />
<link rel="apple-touch-icon" sizes="114x114" href="/favicon/apple-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="120x120" href="/favicon/apple-icon-120x120.png" />
<link rel="apple-touch-icon" sizes="144x144" href="/favicon/apple-icon-144x144.png" />
<link rel="apple-touch-icon" sizes="152x152" href="/favicon/apple-icon-152x152.png" />
<link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-icon-180x180.png" />
<link rel="icon" type="image/png" sizes="192x192" href="/favicon/android-icon-192x192.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="96x96" href="/favicon/favicon-96x96.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png" />
<link rel="manifest" href="/favicon/manifest.json" />
<meta name="msapplication-TileColor" content="#ffffff" />
<meta name="msapplication-TileImage" content="favicon/ms-icon-144x144.png" />
<meta name="theme-color" content="#ffffff" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width" />
<link rel="stylesheet" href="/css/ol.css" />
<link rel="stylesheet" href="/css/style.css" />
</head>
<body>
<div id="overlay" onclick="off()">
<div id="text">Bienvenue sur Drone map helper !</div>
<p id="subtext">
Inspiré de
<a href="https://map.geo.admin.ch/?layers=ch.bazl.luftfahrthindernis,ch.bazl.einschraenkungen-drohnen,ch.bafu.bundesinventare-vogelreservate,ch.bafu.bundesinventare-jagdbanngebiete&lang=fr&topic=aviation&bgLayer=ch.swisstopo.pixelkarte-grau&layers_visibility=false,true,true,true&catalogNodes=1379,2863&layers_opacity=1,0.6,0.75,0.75"
target="_blank">la carte officielle de l'OFAC</a>, Drone map
helper
vous permet de parcourir les différents éléments
importants à savoir avant de faire voler votre drone.<br /><br />
Afin de vous offrir la meilleure expérience possible, merci de
désactiver vos bloqueurs de publicités pour cette application, car ils
peuvent empêcher le chargement de certaines données.<br /><br />
Vous pouvez combiner plusieurs couches afin de voir où se trouvent les
zones interdites de vol ainsi que les conditions météorologiques. Par
défaut, les couches interactives sont activées.<br /><br />
(Vous pouvez cliquer n'importe où pour fermer ce message)
</p>
</div>
<div id="content">
<div id="map">
<div id="bloc-input" class="input-group">
<input id="adress" type="text" class="form-control" placeholder="Saisir une adresse, une ville ou un lieu..." />
<span class="input-group-btn">
<button id="searchbox" class="btn btn-success" type="button">
Rechercher<i class="fa fa-map-marker"></i>
</button>
</span>
</div>
</div>
<div id="info">
Cliquez sur des éléments de la carte pour obtenir des informations
</div>
<div id="tracking">
<label for="track">
Utiliser ma position <input id="track" type="checkbox" />
</label>
</div>
<div id="displayLegends">
<label for="displayLegends">
Afficher les légendes <input id="legends" type="checkbox" />
</label>
</div>
</div>
<div id="legendsboxes">
<div id="legend1" display="none">
<div class='legend-title'>Niveau d'humidité en %</div>
<div class='legend-scale'>
<ul class='legend-labels'>
<li><span style='background:#f32409;'></span>- 10</li>
<li><span style='background:#edfd02;'></span>20 - 40</li>
<li><span style='background:#61e179;'></span>40 - 60</li>
<li><span style='background:#52b9f7;'></span>60 - 80</li>
<li><span style='background:#5667f7;'></span>+ 80</li>
</ul>
</div>
</div>
<div id="legend2" display="none">
<div class='legend-title'>Précipitations en mm</div>
<div class='legend-scale'>
<ul class='legend-labels'>
<li><span style='background:#6994fc;'></span>- 5</li>
<li><span style='background:#02c621;'></span>5 - 15</li>
<li><span style='background:#daff35;'></span>15 - 25</li>
<li><span style='background:#ff6101;'></span>25 - 45</li>
<li><span style='background:#fb1403;'></span>+ 45</li>
</ul>
</div>
</div>
</div>
<script src="/js/jquery3.3.1.min.js"></script>
<script src="/js/cartodb.3.15.core.js"></script>
<script src="/js/jquery1.7.1.min.js"></script>
<!-- <script
src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL">
</script> -->
<script src="/js/ol.js"></script>
<script src="/dist/ol-layerswitcher.js"></script>
<script src="/js/unfold.js"></script>
<script src="https://www.muggli.one/heig/geoinf-app/api/api.js"></script>
<script src="/js/script.js"></script>
</body>
</html>