Google-Maps Karte in Artikeln anzeigen

dD · Beitrag von dD » 17.09.2008 09:18

Die von Dir eingebundene Datei macht das übrigens selbst und definiert dafür die Funktion GScript(src)
Code: Alles auswählen
function GScript(src) {
document.write('<' + 'script src="' + src + '"' +' type="text/javascript"><' + '/script>');
}

ähhhh..... hab ich leider nicht verstanden.
(Werde ich mir wohl doch mal ein Buch kaufen müssen.

)

Wenn ich die Funktion GScript(src) (s.o.) in die If Abfrage direkt VOR den anderen Code einsetze und die "<script src=.." Zeile im Head rausnehme, woher ist dann die Funktion definiert?

Um es mit deinen Worten zu sagen:

Es ist zwar ganz sinnvoll zu schreiben, was man da macht...
... aber effektiver ist es das Ergebnis (oder zumindest den vollständigen Code) zu zeigen,

Beitrag von **MarkusR** » 17.09.2008 10:15

Du mußt schon meinen Code nehmen, da diese Funktion GScript erst durch das eingebundene Script definiert wird. Somit steht die Funktion auch erst danach zur Verfügung. Wollte Dir nur einen alternativen Code zeigen, mit dem man das machen kann...

Ist ja schließlich witzig, wenn Du fragst, wie man eine Javascript-Datei per JavaScript einbinden kann und genau die Datei, die Du einbinden willst, dies schon in der ersten Zeile exemplarisch zeigt...

dD · Beitrag von dD » 19.09.2008 17:49

Also das mit dem "document.write(.." hat leider nicht geklappt, werde ich mich evtl. später noch mal drum kümmern. Hab im Moment einfach zu viele Baustellen.

Aktuell funktioniert jedenfalls die Kartenanzeige ganz Prima und wird auch bei nur ISDN (spätestens beim zweiten Aufruf) ganz fix geladen.

dD · Beitrag von dD » 19.09.2008 18:34

So noch mal eine Zusammenfassung falls es jemanden Interessiert:

Google-Map in Conpresso 4 als Artikel einbinden.
Vor der eigentlichen Arbeit im Conpresso muss man sich bei Google einen eigenen Key besorgen, der ist unikat für jede Domain!
Hier sind der Link dahin und Ihr findet dort eigentlich alle Infos die man braucht.

Conpresso:
Als erstes im <Head> Bereich, also der "global_header.php(.dist)" den Verweis auf die Google-Api einbinden.

Code: Alles auswählen

   <script src="http://maps.google.com/maps?file=api&v=2&key= ... hier der Key ... &hl=de" type="text/javascript"></script>

Dann das Body-Tag erweitern um

Code: Alles auswählen

<body onunload="GUnload()">

als 3. in der "global_footer.php(.dist)" folgenden Code am Ende nach dem </body> einfügen:

Code: Alles auswählen

</body>

<!-- Start of Google-Maps Script -->
<script language="JavaScript">
   var count=0;
   var divs=document.getElementsByTagName("DIV");
   for (i=0;i<divs.length;i++)
   {
      if (divs[i].className=="googleMap")
      {
         count++;
      }
   }
   if ( count > 0 )
   {   
    // ab hier Google Maps Code ...
    //<![CDATA[

    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng( 51.234531, 6.23456), 14);
        var point = new GLatLng(51.234531, 6.2345);
        map.addOverlay(new GMarker(point));
      }
    }
    //]]>

    load(); // und jetzt laden!

   }
</script>   <!-- End of Google-Maps Script -->

</html>

-Die Zeile "map.setCenter(new GLatLng( 51.234531, 6.23456 ), 14);"müsst Ihr auf jeden Fall einbringen um eure Karte auf diese Koordinate (Eure GPS-Koordinaten eintragen!) zu zentrieren.
- Die ", 14);" dahinter ändert den entsprechenden Zoom-Level.
- Mit "var point = new GLatLng(51.234531, 6.2345);" und " map.addOverlay(new GMarker(point));"
setzt Ihr einen entsprechenden Marker auf der Karte, z.B. den Ort eures besondern Interesses.
Dann können noch jede Menge Optionen folgen um auf der Karte z.B. Controls für Zoom und Darstellung einzufügen.
Dafür bitte die API (siehe Link oben) von Google durchlesen.

----------
Jetzt braucht Ihr nur noch in einem Artikel (oder Template ...) das <div> für die eigentliche Anzeige der Map einzubringen.
..style="width: 550px; height:400px;" könnt Ihr natürlich nach gutdünken ändern und jeweils anpassen.

Code: Alles auswählen

<div class="googleMap" id="map" style="width: 550px; height: 400px;">Google-Maps Karte</div>

Vielen Dank an MarkusR für die ausgiebige Hilfe, alleine kann ich sowas nämlich nicht.

Wäre natürlich schön wenn Verbesserungen hier noch einfließen würden.