Openlayers: Optimierung in Javascript

Openlayers durchschauen

Man kann OpenLayers in seine Websites anhand vorhandener – mehr oder weniger gut dokumentierter Vorlagen – in Javascript einbinden. Voraussetzung ist Erfahrung in der Benutzung gängiger Programmiersprachen und der Kenntnis gängiger Schnittstellen von Programmiersprachen zu normierten Diensten (FTP, HTTP usw.?).

Eine einfache Anwendung wäre die Darstellung einer Landkarte, auf der die mit dem Fahrrad zurückgelegten Strecken der vergangenen Tage dargestellt werden. Das macht die ganze Geschichte schwierig, weil nämlich die Kartendaten einen nicht unerheblichen Traffik erzeugen. Die entsprechende interaktive Karte, die einen Zoom und ein Verschieben zulässt, lässt sich mittels der OpenLayers-Api relativ einfach programmieren.

Schön wäre es, wenn man z. B. die einzelnen Tracks jeweils in einer einigen Zeile mit allen Attributen

  • einem beschreibenden Text,
  • der Anzahl der gefahrenen Kilometer,
  • dem Namen der GPX-Datei,
  • der Farbe, in der der Track abgebildet werden soll und
  • der Transparenz des Track-Linienzugs auf der Karte

aufschreiben könnte. Das würde dann so aussehen:

// *******************************************************************************
 // * Tracks in der OSM-Karte
 // *******************************************************************************
 // 
  map.addLayer(new erstelle_Strecke("01.01.2018","8 km","2018.01.01.gpx","magenta"))
  map.addLayer(new erstelle_Strecke("02.01.2018","8 km","2018.01.02.gpx","magenta"))
  map.addLayer(new erstelle_Strecke("04.01.2018","13 km","2018.01.04.gpx","magenta"))
  map.addLayer(new erstelle_Strecke("05.01.2018","16 km","2018.01.05.gpx","magenta"))
  map.addLayer(new erstelle_Strecke("06.01.2018","17 km","2018.01.06.gpx","magenta"))
  map.addLayer(new erstelle_Strecke("07.01.2018","13 km","2018.01.07.gpx","magenta"))
  map.addLayer(new erstelle_Strecke("08.01.2018","26 km","2018.01.08.gpx","magenta"))
  map.addLayer(new erstelle_Strecke("09.01.2018","25 km","2018.01.09.gpx","magenta"))
  map.addLayer(new erstelle_Strecke("12.01.2018","24 km","2018.01.12.gpx","magenta"))

Wie das ausssieht, kann man hier sehen (Stand am 12.01.2018).

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahren Sie mehr darüber, wie Ihre Kommentardaten verarbeitet werden .