Dieses Dokument beschreibt die Hintergründe für die Erstellung der TYPO3-Extension netcos_googlemap_noflexform zur Darstellung von einer oder mehrerer Google-Maps innerhalb TYPO3. Dies ist keine offizielle Extension, sie ist nicht auf typo3.org erhältlich.

Die Werte für Latitude, Longitude und Zoomlevel lassen sich im Plugin einstellen, so dass auch mehrere Karten dargestellt werden können.

Es wird jedoch abgeraten, diese Extension einzusetzen. Die offizielle Extension netcos_googlemap ersetzt und verbessert diese Extension, denn sie benutzt flexform. Diese Extension netcos_googlemap_noflexform ist jedoch geeignet für Personen, die das Erstellen von Extensions lernen wollen.

Wenn man die Google-Map auf einer Domain benutzen will, muss man von Google eine Kennzahl für diese Domain besorgen.

Die Werte des HTML-Headers lassen sich in TypoScript durch den Parameter headerData eingeben. Man muss hier ein JavaScript-Programm auf der Google-Website aufrufen. Zwei TypoScript-Befehle sind hierzu notwendig:

page.headerData.900 = TEXT
page.headerData.900.value (
  <script src="http://maps.google.com/maps?file=api&v=2&key={$google_map_key}"
          type="text/javascript">
  </script>
)

page bezieht sich hier auf das Objekt, das mit PAGE erzeugt wurde und auf typeNum 0 läuft. Vielleicht heißt es bei Ihnen seite. Der Wert 900 ist willkürlich gewählt. Sie sollten nur darauf achten, dass dieser Wert nicht an einer anderen Stelle ebenfalls von headerData verwendet wird. google_map_key ist die Konstante, die die Kennzahl gespeichert hat.

Der kickstarter ist das Werkzeug von TYPO3 zur Erstellung von Extensions.

Als erstes muss die Extension kickstarter installiert werden. Dadurch entsteht im Menü des Extension Manager der neue Eintrag Neue Extension anlegen, den wir anwählen.

Im entstehenden Formular gibt man zuerst den Namen im Feld Enter extension key: an, in diesem Fall netcos_googlemap_noflexform. Bestätigung mit dem Button Update....

Im Folgenden wird die Optionsliste KICKSTARTER WIZARD im Formular bearbeitet. Man drückt zuerst das Pluszeichen von General info. Darin erstellt man den Title Netcos googlemap no flexform. Als Category wählt man Frontend Plugins. Man lässt State auf Alpha. Für Dependencies gibt man cms an. Author hinzufügen. Den Button Update... betätigen

Als nächstes das Pluszeichen von Setup languages und darin die Sprache German wählen. Bestätigung durch Update.... Die Standardsprache der Extension ist immer Englisch, die gewählte deutsche Sprache ist eine Zusatzsprache.

Nun das Pluszeichen von Frontend Plugins betätigen. Man gibt title: Netcos googlemap noflexform in beiden Sprachen an. Anklicken Add icon to ‘New Content Element’ wizard:. Update.

Als nächstes ergänzen wir die bestehende Tabelle tt_content um die Datensätze, die im Plugin später angegeben werden. Wir wählen das Pluszeichen von Extend existing Tables. Unter Which table wähle Content (tt_content). Nun geben wir die Datensatznamen in NEW FIELD: an.

• Zuerst den Field name width mit Field title: Width und Breite, als Field type: String input. Update. In den entstehenden Feldern geben wir Field width und Max characters 4 an. Required nicht ankreuzen.

• Auf gleiche Weise wird ein neuer Datensatz erzeugt mit den entsprechenden Werten: height, Height, Höhe, String input, 4.

• Ein weiterer Datensatz mit den Werten: latitude, Latitude, Breitengrad (Latitude), String input, 10, 15.

• Und: longitude, Longitude, Längengrad (Longitude), String input, 10, 15.

• Sowie: zoom, Zoom Level, Zoomlevel, String input, 5, 5.

• Als nächstes wird das Pluszeichen von Frontend Plugins gedrückt. title: Netcos Google Map und Netcos Google-Map. Anklicken Add icon to ‘New Content Element’ wizard:. Update.

Die Eingabe ist jetzt abgeschlossen. Daher den Feldbutton View result wählen. Dort auf WRITE klicken. Die Extension wird dann auf typo3conf/ext/netcos_googlemap_noflexform/ abgespeichert.

Die Extension ist jetzt erstellt und könnte auf Install Extensions installiert werden. Im Frontend würde jedoch noch keine Karte angezeigt, da nur ein Standardtext ausgegeben wird, der vom Kickstarter-Wizard erzeugt wurde. Daher muss der Quellcode in den erstellten Dateien angepasst werden.

Sobald eine Datei im Quellcode (in typo3conf/ext/netcos_googlemap_noflexform/) geändert wird, darf der Kickstarter nicht mehr verwendet werden, da er alle Dateien mit Defaultwerten überschreibt.

Es scheint, als ob im Quellcode die Dateien wizard_form.* in typo3conf/ext/netcos_googlemap_noflexform/doc/ gelöscht werden können.

Quellcodedateien einer Extension können im Ext Manager geändert werden. Dazu wird der Menüeintrag Install extensions gewählt. Da die erstellte Extension bereits im Verzeichnis typo3conf/ext gespeichert wurde, wird sie hier auch aufgeführt. Wir klicken auf den Namen der Extension. Dadurch entsteht ein neues Menü, in dem wir Edit files wählen. Alle Quellcodedateien der Extension werden nun dargestellt. Wenn man nun auf den Knopf Edit file neben dem Dateinamen klickt, wird ein Editor mit dieser Datei geöffnet, in dem man die Datei ändern kann.

Die Hauptdatei zur Änderung ist die Datei pi1/class.tx_netcosgooglemapnoflexform_pi1.php. In ihr wird der Bereich mit den Defaultwerten

  $content='
    ...
  ';

ersetzt durch den folgenden Code

     $query = "SELECT tx_netcosgooglemapnoflexform_width," .
              "tx_netcosgooglemapnoflexform_height," .
              "tx_netcosgooglemapnoflexform_latitude," .
              "tx_netcosgooglemapnoflexform_longitude," .
              "tx_netcosgooglemap_zoom " .
              "FROM tt_content " .
              "WHERE uid=".$this->cObj->data['uid'];
     $res = mysql(TYPO3_db,$query);        
     $row = mysql_fetch_array($res);
     
     $content="
       <div id='map'
         style='width: ".$row['tx_netcosgooglemapnoflexform_width']."px;
                height: ".$row['tx_netcosgooglemapnoflexform_height']."px'>
       </div>
       
       <script type='text/javascript'>
         //<![CDATA[
           if (GBrowserIsCompatible()) {
             var map = new GMap2(document.getElementById('map'));
             map.addControl(new GLargeMapControl());
             map.addControl(new GMapTypeControl());
             map.setCenter(new GlatLng(".
               $row['tx_netcosgooglemapnoflexform_latitude']."," .
               $row['tx_netcosgooglemapnoflexform_longitude'].")," .
               $row['tx_netcosgooglemapnoflexform_zoom'].",G_HYBRID_MAP);
          }
        //]]>
      </script>
    ";

Dieser Code beruht auf der TYPO3-DVD Einstieg in TYPO3 4.0 von Thomas Kötter.

Man kann die Extension verwenden, indem man im TYPO3-Modul Seite auf eine der Seiten den Button Neues Element anlegen drückt und im entstehenden Auswahlfeld das Plugin der Erweiterung aussucht.

Im Plugin können 5 Felder gesetzt werden: die Bildbreite und -höhe, der Breiten- (latitude) und Längengrad (longitude) des Zentrums der Karte und die Zoomgröße für die Karte. Diese Felder können frei gesetzt werden.

Nun sollte die Karte dargestellt werden. Falls nicht, so liegt der Fehler meist bei einem selbst, nicht bei Google. Mögliche Fehler sind:

• falsche Kennzahl

• die Dezimalzahl für die Grade wurde falsch eingegeben

• der Zoomlevel ist eine ganze Zahl zwischen 0 und 19