Flugverkehr über München

Flugbewegungen über München: Dargestellt in WordPress mit diversen Plugins und APIsMit zwei WordPress-Plugins und einer geeigneten Datenquelle kann man den Flugverkehr über München, ja überall in der Welt, auf seiner Website darstellen.
Und das geht so:

  1. Installiere die WordPress-Plugins Flexible Map und mein Plugin JSON Content Importer in der PRO-Version (sorry, das kostet leider)
  2. Hole Dir bei Google einen API key für Deine Website: Das ist nötig, da Google seine Karten nur zur Verfügung stellt, wenn man sich dort einträgt.
    Den API-Schlüssel musst Du in den Optionen des Plugins Flexible Maps eintragen und speichern.
  3. Füge folgenden twig-code in den Template-Manager des Plugins JSON Content Importer ein. Durch das Abspeichern bekommst Du eine ID für diesen Template-Baustein:

    <?xml version="1.0" encoding="UTF-8"?>
    <kml xmlns="http://www.opengis.net/kml/2.2">
    <Document>
    <Style id="jcistylemucland">
          <IconStyle>
            <Icon>
              <href>http://maps.google.com/mapfiles/kml/pushpin/grn-pushpin.png
              </href>
            </Icon>
          </IconStyle>
         </Style>
    <Style id="jcistylemucstart">
          <IconStyle>
            <Icon>
              <href>http://maps.google.com/mapfiles/kml/pushpin/blue-pushpin.png
              </href>
            </Icon>
          </IconStyle>
         </Style>
    <Style id="jcistyle">
          <IconStyle>
            <Icon>
              <href>http://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png
              </href>
            </Icon>
          </IconStyle>
         </Style>
     {% for f in acList %}
    <Placemark>
    <name>
    <![CDATA[
    {{f.Op}} {{f.Mdl}}: {{f.Id}}
    ]]></name>
    {% if f.From=="EDDM Munich, Germany" %}
    <styleUrl>#jcistylemucstart</styleUrl>
    {% elseif f.To=="EDDM Munich, Germany" %}
    <styleUrl>#jcistylemucland</styleUrl>
    {% else %}
    <styleUrl>#jcistyle</styleUrl>
    {% endif %}
    <description>
    <![CDATA[
    PosTime: {{ (f.PosTime // 1000) | date('d.m.Y H:i') }}
    Alt: {{f.Alt}}
    {% if f.From is not empty %}
    From: {{f.From}}
    To: {{f.To}}
    {% endif %}
    ]]></description>
    <Point>
          <coordinates>{{f.Long}},{{f.Lat}}</coordinates>
    </Point>
    </Placemark>
    {% endfor %}
    </Document>
    </kml>
    
  4. Erstelle eine neue Seite oder einen neuen Blogpost mit folgendem Code (lat und lng sind die georaphischen Daten für München). Diese Seite wird den neuen, sogenannten KML-Feed enthalten, den Google Maps als Input benötigt:

    [jsoncontentimporterpro url=https://public-api.adsbexchange.com/VirtualRadar/AircraftList.json?lat=48.137154&amp;lng=11.576124&amp;fDstL=0&amp;fDstU=100 parser=twig id=ID_TEMPLATE_MANAGER]
  5. Veröffentliche diese Seite und schau sie dir im Browser an. Hier im Beispiel: https://www.kux.de/kml-feed-munich/.
    Füge an der URL hinten „?show=oc“ an, dadurch sollte sich die Optik deutlich reduzieren: https://www.kux.de/kml-feed-munich/?show=oc. Über http://googlemapsapi.blogspot.de/2007/06/validate-your-kml-online-or-offline.html kann man sicherstellen, dass der KML-Feed korrekt ist.
  6. Was tun, wenn der KML-Feed nicht ok ist?
    Ein Grund kann sein, dass WordPress dazwischenfunkt und Extrazeichen einfügr (Stichwort wpautop). Hier versuche in den Optionen des Plugins JSON Content Importer unter „Options“ und dann „Settings“ bei „Use wpautop or not:“ wähle „remove wpautop“.

    Oder: Wenn eine andere API verwendet wird, muss man entsprechend den twig-Code ändern, der die Daten der API nimmt und in KML-XML konvertiert.
  7. Erstelle eine weitere neue Seite, auf dem Du Google-Maps und die Daten zusammenbringst: Wenn Du diese Seite ansiehst sollten die Flugbewegungen über München auf der Karte zu sehen sein. Alle 5 Minuten bringt ein Reload der Seite neue Daten (5 Minuten ist die Zeit, die Google Maps solche Daten zwischenspeichert, mit weiterne Tricks könnte man das „umgehen“).
    Also, bitte folgenen Code auf die Seite:

    [flexiblemap src="https://www.kux.de/kml-feed-munich/?show=oc" kmlcache="5 minutes" zoom="7"]
  8. Here we go:
    Start in München

    Landung in München

    Überflug München oder unbekannter Start / Landung