Neues Modul "Google Maps"

[tommo]

Hi,

ich hab mal auf die schnelle ein Google-Maps Modul gebastelt.

Hier ein Screenshot der Konfiguration:




Download:
Google_Maps.xml

Installation:
1.Goolge-Maps-Key beantragen unter http://www.google.com/apis/maps/signup.html

2.In den Head-Bereich des Layouts muß folgendes eingetragen werden:

Code: Alles auswählen

<script src="http://maps.google.com/maps?file=api&v=2&key=hierkeyeintragen" type="text/javascript"></script>

3. In den Body-Tag des Layouts folgendes eintragen:

Code: Alles auswählen

onload="load()" onunload="GUnload()"

Kleiner Tip: Ich hab den Eintrag im Layout per if-Abfrage (idart) beschränkt, so muß ich nicht ein extra Layout anlegen.

Code: Alles auswählen

<?if ($idart=="idart des Artikels"){echo 'onload="load()" onunload="GUnload()"';}?>

4. neues Modul erstellen und xml importieren

5. neues Template erstellen und Modul an gewünschter Stelle auswählen.

6. Neue Seite mit Artikel erstellen

4. In der Konfiguration des Artikels das Modul konfigurieren.




Es gibt noch einen kleinen Bug und da ich nicht der PHP-Held bin weiß ich nicht recht, wie ich das wegbringe.
Wenn ich Im Textfeld (Text für Infofenster) einen Umbruch habe wird der Text auch im Quelltext der Ausgabe umgebrochen und so ein Javascriptfehler angezeigt. Auch ein nl2br hat nix gebracht.
Bin dankbar für jede Hilfe.

Was könnte man denn noch so einbauen?

Tom

[schlaucher]

Hi,

ich hab mal auf die schnelle ein Google-Maps Modul gebastelt.

...

Download:
Google_Maps.xml

Der Download Link funktioniert nicht

Gruß
schlaucher

[tommo]

jetzt geht's

am besten mit der rechten Maustaste anklicken (speichern unter...)

sorry

Tom

[schlaucher]

jetzt geht's

am besten mit der rechten Maustaste anklicken (speichern unter...)

sorry

Tom

ja, danke

[Contenider]

Poste den Code bitte hier im Thread, Downloads verschwinden immer wieder.

[tommo]

O.K. hier der Code:

Beschreibung

Code: Alles auswählen

Google Maps Modul
1.Bitte eine Goolge-Maps-Key beantragen unter http://www.google.com/apis/maps/signup.html

2.In den Head-Bereich der Seite muß folgendes eingetragen werden:
 <script src="http://maps.google.com/maps?file=api&v=2&key=hierkeyeintragen" type="text/javascript"></script>

3. In den Body-Tag folgendes eintragen:
 onload="load()" onunload="GUnload()"

4. In der Konfiguration des Artikels das Ziel eintragen.

Autor: Tommo
Version: 1.0

Input

Code: Alles auswählen

echo"
 <table cellspacing=\"0\" cellpadding=\"5\" border=\"0\">
 <tr valign=\"top\"> 
  <td width=\"302\" colspan=\"2\"><strong>Ziel</strong></td> 
 </tr>
 <tr valign=\"top\"> 
  <td width=\"302\">Strasse</td> 
  <td><INPUT TYPE=\"text\" NAME=\"CMS_VAR[1]\" VALUE=\"CMS_VALUE[1]\"></td>
 </tr>
 <tr valign=\"top\"> 
  <td width=\"302\">Hausnummer</td> 
  <td><INPUT TYPE=\"text\" NAME=\"CMS_VAR[5]\" VALUE=\"CMS_VALUE[5]\"></td>
 </tr>
 <tr valign=\"top\"> 
  <td width=\"302\">Postleitzahl</td> 
  <td><INPUT TYPE=\"text\" NAME=\"CMS_VAR[2]\" VALUE=\"CMS_VALUE[2]\"></td>
 </tr>
 <tr valign=\"top\"> 
  <td width=\"302\">Ort</td> 
  <td><INPUT TYPE=\"text\" NAME=\"CMS_VAR[3]\" VALUE=\"CMS_VALUE[3]\"></td>
 </tr>
 <tr valign=\"top\"> 
  <td width=\"302\">Land</td> 
  <td><INPUT TYPE=\"text\" NAME=\"CMS_VAR[4]\" VALUE=\"CMS_VALUE[4]\"></td>
 </tr>
<tr>
<td colspan=\"2\"><hr style=\"width: 100%;\"></td>
</tr> 
<tr valign=\"top\"> 
  <td width=\"302\" colspan=\"2\"><strong>Konfiguration</strong></td> 
 </tr>
 <tr valign=\"top\"> 
  <td width=\"302\">Breite der Karte</td> 
  <td><INPUT TYPE=\"text\" NAME=\"CMS_VAR[6]\" VALUE=\"CMS_VALUE[6]\">px</td>
 </tr>
 <tr valign=\"top\"> 
  <td width=\"302\">Höhe der Karte</td> 
  <td><INPUT TYPE=\"text\" NAME=\"CMS_VAR[7]\" VALUE=\"CMS_VALUE[7]\">px</td>
 </tr>
 <tr valign=\"top\"> 
  <td width=\"302\">Kartenart</td> 
  <td>
<select name=\"CMS_VAR[8]\">
<option value=\"0\">Karte</option>";

    if (CMS_VALUE[8] == 1) {
        echo '<option value="1" selected="selected">Satellit</option>';
    } else {
        echo '<option value="1">Satellit</option>';
    }

    if (CMS_VALUE[8] == 2) {
        echo '<option value="2" selected="selected">Hybrid</option>';
    } else {
        echo '<option value="2">Hybrid</option>';
    }

echo "
</select>
</td>
 </tr>
<tr valign=\"top\"> 
  <td width=\"302\">Kartenauswahlfunktion anzeigen</td> 
  <td>
<select name=\"CMS_VAR[9]\">
";

    if (CMS_VALUE[9] == 1) {
        echo '<option value="1" selected="selected">Nein</option>';
    } else {
        echo '<option value="1">Nein</option>';
    }

    if (CMS_VALUE[9] == 2) {
        echo '<option value="2" selected="selected">Ja</option>';
    } else {
        echo '<option value="2">Ja</option>';
    }

echo "
</select>
</td>
 </tr>
<tr valign=\"top\"> 
  <td width=\"302\">Zoomfunktion aneigen</td> 
  <td>
<select name=\"CMS_VAR[10]\">
";

    if (CMS_VALUE[10] == 1) {
        echo '<option value="1" selected="selected">Aus</option>';
    } else {
        echo '<option value="1">Aus</option>';
    }

    if (CMS_VALUE[10] == 2) {
        echo '<option value="2" selected="selected">Klein</option>';
    } else {
        echo '<option value="2">Klein</option>';
    }
    if (CMS_VALUE[10] == 3) {
        echo '<option value="3" selected="selected">Groß</option>';
    } else {
        echo '<option value="3">Groß</option>';
    }
echo "
</select>
</td>
 </tr>";
echo"
 <tr valign=\"top\"> 
  <td width=\"302\">Text im Infofenster</td>
<td><textarea NAME=\"CMS_VAR[15]\" cols=\"40\" rows=\"5\">CMS_VALUE[15]</textarea></td>
 </tr>";
 echo "</table>";

Output

Code: Alles auswählen

<?php
$str = "CMS_VALUE[1]";
$plz = "CMS_VALUE[2]";
$ort = "CMS_VALUE[3]";
$land = "CMS_VALUE[4]";
$hsn = "CMS_VALUE[5]";
$width = "CMS_VALUE[6]";
$height = "CMS_VALUE[7]";
$maptyp = "CMS_VALUE[8]";
$mapcontrol = "CMS_VALUE[9]";
$zoomcontrol = "CMS_VALUE[10]";
$infotextfenster = "CMS_VALUE[15]";

function get_lat_long($q) { 
 global $lat,$lon; 
 $q = urlencode($q); 
 $gm = fopen('http://maps.google.com/maps?q=' . str_replace('','+',$q) . '&output=js','r'); 
 $tmp = @fread($gm,30000); 
 fclose($gm); 
 $pos=strpos($tmp,"center"); 
 $wert=substr($tmp,$pos,40); 
 $lat=substr($wert,14,9); 
 $lon=substr($wert,29,9); 
} 
$q = $str.' '.$hsn.', '.$plz.' '.$ort.', '.$land; 
$tmp = get_lat_long($q); 


if ($maptyp==2){
$anzeige = "G_HYBRID_MAP";
}elseif ($maptyp==1) {
$anzeige = "G_SATELLITE_MAP";
}else{
$anzeige = "G_NORMAL_MAP";
}


?>


<?php// $infotext = str_replace("\n", "<br>",$infotextfenster);?>
<?php $infotext = nl2br($infotextfenster);?>

  <div id="map" style="width: <?php echo $width;?>px; height: <?php echo $height;?>px;"></div>
  <script type="text/javascript">
 //<![CDATA[
    function load() {
	
 if (GBrowserIsCompatible()) {
 
 function createMarker(point,html) {
        var marker = new GMarker(point);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        return marker;
      }
 
//Map erstellen und zentrieren, Anzeige der Funktionen
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(<?php echo $lat;?>, <?php echo $lon;?>), 14, <?php echo $anzeige;?>);
<?if ($mapcontrol == 2){echo "map.addControl(new GMapTypeControl());";}?> 
<?if ($zoomcontrol == 2){echo "map.addControl(new GSmallMapControl());";}?> 
<?if ($zoomcontrol == 3){echo "map.addControl(new GLargeMapControl());";}?> 




	  

//marker bei klick 
function createMarker(point,html) { 
var marker = new GMarker(point); 
marker.html = html; 
GEvent.addListener(marker, "click", function() { 
marker.openInfoWindowHtml(marker.html); 
}); 
return marker; 
} 



var marker1 = createMarker(new GLatLng(<?php echo $lat;?>, <?php echo $lon;?>),"<? echo $infotext;?>"); 
map.addOverlay(marker1); 


}    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }
    }//endload
    //]]>
</script>

Tom

[Felicita]

zum Umbruch -

das bestimmst du nicht in php, sondern in der googlemap

marker.openInfoWindowHtml("<span class='Stil1'>Meine Adresse<br>und Strasse 14<br>15370 Fredersdorf</span>");

kann man auch a href-befehler eingeben e.c.

oder


marker.openInfoWindowHtml("<span class='Stil1'><b><?php echo 'CMS_VALUE[4]';?></b> <br><?php echo 'CMS_VALUE[3]';?><br><?php echo 'CMS_VALUE[2] CMS_VALUE[1]';?></span>");

ich habe mir mal meine eigenen Variablen eingesetzt

und ein css Stil, damit es nett aussieht.

und hier noch ein Beispiel das ein Bild anzeigt:
var marker = createMarker(point,'Some stuff to display in the<br>Second Info Window with an image<br><img src="image.jpg" width=150 height=100>')

und der Link dazu:
http://www.econym.demon.co.uk/googlemap ... s/map6.htm

(ja jetzt müßte man das nur noch so machen, das man einstellen kann, wie viele Marker man ausgeben möchte und wo die Startposition ist...
dann noch das Feld für das Foto -(mit durchsuchen)- einfügen....



übrigens, verwendet google utf8, also wenn mann das nicht in sein Contenido hat also die ganze Seite in iso...ec so hilft das:

charset=utf-8 in das Javascript einfügen:

<script src="http://maps.google.com/maps?file=api&v=2&key=hier der key"
type="text/javascript" charset=utf-8></script>

[ThomasH]

Hi,
so läuft das nicht, es kommt die Fehlermeldung:

Parse error: parse error, unexpected T_STRING in /homepages/***/htdocs/cms/front_content.php(1021) : eval()'d code on line 1136

Ich hab ne Weile gesucht und gefunden:

Code: Alles auswählen

<?php
$str = "CMS_VALUE[1]";
$plz = "CMS_VALUE[2]";
$ort = "CMS_VALUE[3]";
$land = "CMS_VALUE[4]";
$hsn = "CMS_VALUE[5]";
$width = "CMS_VALUE[6]";
$height = "CMS_VALUE[7]";
$maptyp = "CMS_VALUE[8]";
$mapcontrol = "CMS_VALUE[9]";
$zoomcontrol = "CMS_VALUE[10]";
$infotextfenster = "CMS_VALUE[15]";

Da hattest Du die '"' vergessen! Bitte korrigiere den Code oben noch für den nächsten armen Anfänger.

Gruß
Thomas

[ThomasH]

Noch was:

mit:

Code: Alles auswählen

<?php $infotext = ereg_replace("(\r\n|\n|\r)", "<br>", $infotextfenster);?>

statt:

Code: Alles auswählen

<?php// $infotext = str_replace("\n", "<br>",$infotextfenster);?>
<?php $infotext = nl2br($infotextfenster);?>

läuft es auch mit mehrzeiligen Eingaben für das Info-Fenster

Gruß
Thomas

[tommo]

Super,
danke für den Tip.
Da sieht man mal, dass ich echt kein PHP-Genie bin

[GaMbIt_]

Ich hab da immer irgendeinen fopen() Fehler bekommen...
Habs aber auch nicht weiter verfolgt... nur mal so zum Bugfixing... falls es wirklich ein Fehler sein sollte

[rethus]

Hallo,
der fopen()-Fehler liegt daran, das du in deiner php.ini "allow_url_fopen" auf off stehen hast, was eigentlich auch gut so ist.
Also müsste man den Code anpassen, das er anstatt über fopen über nen socket geht.


Übrigens geht bei mir das Modul scheinbar nicht.
Ich habe alles so eingebunden, wie es im 1. Thread beschrieben wurde (+ den Anfürhungszeichen bei der Variablendeklaration). Doch beim aufruf der Seite lädt er zwar google.maps - das sieht man in der Statusleiste), aber es erscheint absolut nichts.

Kann mir jemand einen kleinen Tip geben, woran das liegt?

Denn ne Fehlermeldung bekomme ich auf meiner Javascript-Konsole auch nicht.

PS: MAPS-ID für die Domain hab ich mir eingerichtet.

[tommo]

@rethus: Kann ich mir das irgendwo ankucken

Tom

[peanut]

Hallo zusammen

ich kann bei mir zwar grosse Städte wie Berlin oder New York eingeben aber kleine Orte gehen leider nicht - da kommt immer ein Default - hmmmm hab ich was übersehen ?

Wo kann man denn die Default Lat & Lon + Zoom eingeben ?

Danke
Gruss
Peanut

[Katrin]

Übrigens geht bei mir das Modul scheinbar nicht.
Ich habe alles so eingebunden, wie es im 1. Thread beschrieben wurde (+ den Anfürhungszeichen bei der Variablendeklaration). Doch beim aufruf der Seite lädt er zwar google.maps - das sieht man in der Statusleiste), aber es erscheint absolut nichts.

Kann mir jemand einen kleinen Tip geben, woran das liegt?

Denn ne Fehlermeldung bekomme ich auf meiner Javascript-Konsole auch nicht.

PS: MAPS-ID für die Domain hab ich mir eingerichtet.

Hallo,

ich habe das Modul eben installiert und habe das gleiche Problem.
Hast du inzwischen herausgefunden, woran es bei dir lag?

Gruß, Katrin