44 lines
1.4 KiB
HTML
44 lines
1.4 KiB
HTML
|
{% extends 'base.html' %}
|
||
|
|
|
||
|
|
{% block head %}
|
||
|
|
<link rel="stylesheet" href="/static/leaflet-1.6.0/leaflet.css">
|
||
|
|
{% endblock %}
|
||
|
|
|
||
|
|
{% block header %}
|
||
|
|
<h1 class="display-1">Wetter</h1>
|
||
|
|
{% endblock %}
|
||
|
|
|
||
|
|
{% block content %}
|
||
|
|
<section>
|
||
|
|
<div class="card ">
|
||
|
|
<div class="embed-responsive embed-responsive-16by9">
|
||
|
|
<div class="clickoverlay embed-responsive-item">
|
||
|
|
<p class="text-center">Klicken um die Karte freizuschalten</p>
|
||
|
|
</div>
|
||
|
|
<div id="mapid" class="embed-responsive-item"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="list-group list-group-horizontal-md text-center">
|
||
|
|
<a href="/station/" class="list-group-item flex-fill">Liste aller Stationen</a>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
{% endblock %}
|
||
|
|
|
||
|
|
{% block foot %}
|
||
|
|
<script src="/static/leaflet-1.6.0/leaflet.js"></script>
|
||
|
|
<script>
|
||
|
|
var mymap = L.map('mapid').setView([52, 10], 6);
|
||
|
|
|
||
|
|
L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
|
||
|
|
maxZoom: 18,
|
||
|
|
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
|
||
|
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||
|
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||
|
|
id: 'mapbox/streets-v11',
|
||
|
|
tileSize: 512,
|
||
|
|
zoomOffset: -1
|
||
|
|
}).addTo(mymap);
|
||
|
|
</script>
|
||
|
|
<script src="/dyn/stations.js"></script>
|
||
|
|
{% endblock %}
|