Zurück   Web to Date - SIQUANDO Forum >

Web to Date - Data Becker
> Web to Date allgemein

Antwort
 
LinkBack (4) Themen-Optionen Thema durchsuchen Ansicht
Alt 28.05.2009, 15:18   4 links from elsewhere to this Post. Click to view. #1 (permalink)
Administrator
 
Benutzerbild von blue
 
Registriert seit: 19.03.2009
Ort: Heide Holstein
Beiträge: 2.737
blue wird schon bald berühmt werden
Lächeln Routenplaner mit GoogleMaps-Api einbinden

Viele Webseiten nutzen einen externen Routenplaner um die Anreise z.B. zu einer Ferienwohnung zu planen. Der Besucher wird auf eine andere Webseite geleitet, was unschön aussieht und nicht professionell wirkt. Hier stellen wir ein Lösung mit der Googlemaps-Api vor. Den API-Key gibts hier.

Beispiel:
http://www.webtodateforum.de/tipps-u...oogle-maps.php

Einfach einen HTML Absatz mit folgendem Inhalt erstellen und ein wenig anpassen:

Code:
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=1234"
      type="text/javascript"></script>
<style type="text/css">
      v\:* {
        behavior:url(#default#VML);
      }
 
      table.directions th {
 background-color:#888888;
      }
 
      img {
        color: #000000;
      }
    </style>
    <script type="text/javascript">
    //<![CDATA[
    var map;
    var gdir;
    var geocoder = null;
    var addressMarker;
    function load() {
      if (GBrowserIsCompatible()) {      
        map = new GMap2(document.getElementById("map"));
        map.addControl(new GLargeMapControl());
        gdir = new GDirections(map, document.getElementById("directions"));
        GEvent.addListener(gdir, "load", onGDirectionsLoad);
        GEvent.addListener(gdir, "error", handleErrors);
        setDirections("25746 Heide", "München", "de");
      }
    }
 
    function setDirections(fromAddress, toAddress, locale) {
      gdir.load("from: " + fromAddress + " to: " + toAddress,
                { "locale": locale });
    }
    function handleErrors(){
    if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
      alert("Es wurde kein entsprechender Ort zu Ihrer Routenberechnung gefunden!\nError code: " + gdir.getStatus().code);
    else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
      alert("Leider konnte keine Route berechnet werden!\n Error code: " + gdir.getStatus().code);
 
    else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
      alert("Der HTTP q Parameter fehlt oder hat keinen Inhalt!\n Error code: " + gdir.getStatus().code);
 //   else if (gdir.getStatus().code == G_UNAVAILABLE_ADDRESS)  <--- Doc bug... this is either not defined, or Doc is wrong
 //     alert("Der Geocode für die angegebene Adresse ist fehlerhaft.\n Error code: " + gdir.getStatus().code);
 
    else if (gdir.getStatus().code == G_GEO_BAD_KEY)
      alert("Der angegeben API Key ist für eine andere Domain. \n Error code: " + gdir.getStatus().code);
    else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
      alert("Leider ist ein Fehler bei der Routenberechnung aufgetreten.\n Error code: " + gdir.getStatus().code);
 
    else alert("Ein unbekannter Fehler trat auf!");
 
 }
 function onGDirectionsLoad(){ 
        }
 
    //]]>
    </script>
  <body onload="load()" onunload="GUnload()">
 
  <h2>So könnte Ihr Routenplaner aussehen:</h2>
  <form action="#" onsubmit="setDirections(this.from.value, this.to.value, this.locale.value); return false">
  <table>
   <tr><th align="right">Start:&nbsp;</th>
   <td><input type="text" size="25" id="fromAddress" name="from"
     value=""/></td>
   <th align="right">&nbsp;&nbsp;Zielort:&nbsp;</th>
   <td align="right"><input type="text" size="25" id="toAddress" name="to"
     value="25746 Heide" /></td></tr>
   <tr><th>Sprachauswahl:&nbsp;</th>
   <td colspan="3"><select id="locale" name="locale">
    <option value="de" selectet>Deutsch</option>
    <option value="en">English</option>
    <option value="fr">French</option>
    <option value="it">Italian</option>
    <option value="eu">Basque</option>
    <option value="nl">Dutch</option>
 
      </select>
    <input name="submit" type="submit" value="Routenplanung" />
   </td></tr>
   </table>
 
  </form>
    <br/>
    <table class="directions">
    <tr><th>Hier gehts lang:</th><th>Map</th></tr>
    <tr>
    <td valign="top"><div id="directions" style="width: 275px"></div></td>
    <td valign="top"><div id="map" style="width: 310px; height: 400px"></div></td>
    </tr>
    </table>
blue ist offline   Mit Zitat antworten
Alt 29.05.2009, 11:37   #2 (permalink)
Administrator
 
Benutzerbild von voodoo36
 
Registriert seit: 17.04.2009
Ort: Regensburg
Beiträge: 4.601
voodoo36 befindet sich auf einem aufstrebenden Ast
Beitrag AW: Routenplaner mit GoogleMaps-Api einbinden

Hallo blue, werde das mal testen und dich informieren wie es funktioniert...
__________________
Grüße aus Bayern
voodoo36 ist offline   Mit Zitat antworten
Alt 29.05.2009, 12:05   #3 (permalink)
Administrator
 
Benutzerbild von voodoo36
 
Registriert seit: 17.04.2009
Ort: Regensburg
Beiträge: 4.601
voodoo36 befindet sich auf einem aufstrebenden Ast
Idee AW: Routenplaner mit GoogleMaps-Api einbinden

Hallo blue, ist es möglich auch kleinere Orte suchen zu lassen? zB. Thalmassing wird nicht gefunden, aber Bad Abbach schon! Ich denke dabei an Fußballvereine die oft zu solchen Dörfern fahren müssen! Ansonsten ist das mit das besste was ich gesehen habe... super Idee, Klasse
__________________
Grüße aus Bayern
voodoo36 ist offline   Mit Zitat antworten
Alt 29.05.2009, 12:12   #4 (permalink)
Administrator
 
Benutzerbild von blue
 
Registriert seit: 19.03.2009
Ort: Heide Holstein
Beiträge: 2.737
blue wird schon bald berühmt werden
Standard AW: Routenplaner mit GoogleMaps-Api einbinden

Dann musst Du die Postleitzahl voranstellen...
blue ist offline   Mit Zitat antworten
Alt 29.05.2009, 12:17   #5 (permalink)
Administrator
 
Benutzerbild von voodoo36
 
Registriert seit: 17.04.2009
Ort: Regensburg
Beiträge: 4.601
voodoo36 befindet sich auf einem aufstrebenden Ast
Beitrag AW: Routenplaner mit GoogleMaps-Api einbinden

Cool... danke super Sache
__________________
Grüße aus Bayern
voodoo36 ist offline   Mit Zitat antworten
Alt 29.05.2009, 22:27   #6 (permalink)
Administrator
 
Benutzerbild von voodoo36
 
Registriert seit: 17.04.2009
Ort: Regensburg
Beiträge: 4.601
voodoo36 befindet sich auf einem aufstrebenden Ast
Frage AW: Routenplaner mit GoogleMaps-Api einbinden

Hallo blue ich habe es zum Test mal bei mir eingebaut...
Schau es dir mal an... wie kann ich die (Map Spalte) oberhalb und (hier geht´s lang, Spalte) unterhalb mittig anordnen?
web to date
__________________
Grüße aus Bayern

Geändert von voodoo36 (20.07.2009 um 09:00 Uhr)
voodoo36 ist offline   Mit Zitat antworten
Alt 29.05.2009, 23:41   #7 (permalink)
anphiga
Gast
 
Beiträge: n/a
Standard AW: Routenplaner mit GoogleMaps-Api einbinden

Hallo,
bei mir zeigt es die Map nicht bei Map an sondern unterhalb...?
Was muss ich da genau im HTML anpassen?
Sorry, bin absoluter Neuling.

Grüße aus Aalen
  Mit Zitat antworten
Alt 30.05.2009, 00:04   #8 (permalink)
Neuer Benutzer
 
Registriert seit: 23.03.2009
Beiträge: 21
user32 befindet sich auf einem aufstrebenden Ast
Standard AW: Routenplaner mit GoogleMaps-Api einbinden

Deine Seite ist sicher nicht breit genug

<td valign="top"><div id="directions" style="width: 275px"></div></td>
<td valign="top"><div id="map" style="width: 310px; height: 400px"></div></td>
user32 ist offline   Mit Zitat antworten
Alt 30.05.2009, 18:54   #9 (permalink)
Administrator
 
Benutzerbild von voodoo36
 
Registriert seit: 17.04.2009
Ort: Regensburg
Beiträge: 4.601
voodoo36 befindet sich auf einem aufstrebenden Ast
Idee AW: Routenplaner mit GoogleMaps-Api einbinden

@ anphiga, es kommt auf dein Design an! Der Script ist OK und so gut wie selbsterklärend... kann man das mal sehen?
__________________
Grüße aus Bayern
voodoo36 ist offline   Mit Zitat antworten
Alt 30.05.2009, 22:00   #10 (permalink)
anphiga
Gast
 
Beiträge: n/a
Standard AW: Routenplaner mit GoogleMaps-Api einbinden

Hallo,
funktioniert doch. War mein Fehler.
  Mit Zitat antworten
Antwort

Lesezeichen

Stichworte
anfahrt, google maps, routenplaner

Themen-Optionen Thema durchsuchen
Thema durchsuchen:

Erweiterte Suche
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an


LinkBacks (?)
LinkBack to this Thread: http://www.webtodateforum.de/forum/web-to-date-allgemein/101-routenplaner-mit-googlemaps-api-einbinden.html
Erstellt von For Type Datum Hits
Gelöst: - Marker von Google Maps werden nicht angezeigt - Seite 2 - Joomla CMS Support Forum This thread Refback 09.01.2010 22:32 22
Web to Date Forum - Routenplaner mit Google Maps für Web to Date This thread Refback 29.12.2009 11:56 38
Marker von Google Maps werden nicht angezeigt - Seite 2 - Joomla CMS Support Forum This thread Refback 29.09.2009 23:33 10
Web to Date Forum - Routenplaner mit Google Maps für Web to Date This thread Refback 11.08.2009 08:40 62


admin passwort

Alle Zeitangaben in WEZ +2. Es ist jetzt 12:07 Uhr.
Powered by vBulletin® Version 3.8.2 (Deutsch) - Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.3.0 PL2
Seite generiert in 0,08226 Sekunden mit 17 Datenbankabfragen

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16