Web Development

Ein Lehrbuch für das Informatik oder Medien-Informatik Studium.

Landkarte

als Präsentation ▻
ToDo fertig stellen

Zwei Varianten:

  • Google Maps - kommerziell
  • Open Street Map - Creative Commons Lizenz
▻

Statische Karte

  #map.static {
    background-size: cover;
    background-image: url(map.png);
  }
▻

Dynmische Karte mit leaflet

Für die Darstellung von Open Street Map

var map = L.map('map').setView([lat, lng], 13);

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

$('map').removeClass('static');
▻

Vertiefung