Wie zu setzen Google Map in ihre Web -

Dienstag, 23. Januar 2007

Web2.0 bedeutet auch Software, die über API verteilt (Application Programming Interface). Die Möglichkeit der Nutzung von Remote-Features und Funktionen an anderer Stelle ist sehr nützlich, in der Realität als das Internet. Neben Yahoo, mit dem Toolkit 2.0 Stil, Google - im Rahmen der Geo-Referenzierung - schlägt vor, die kostenlose Tools, in diesem Fall für die Bearbeitung und Verwaltung der Karten.

Google Maps API ermöglicht die Einbettung von Google Maps in Ihre Webseiten mit JavaScript.

Google Maps

Das erste, was zu tun, bevor sie beginnen können, experimentieren Sie mit der API, das Sie auf der Website registrieren http://www.google.com/apis/maps/ zu erhalten, einen Schlüssel (ein UID) auf dem Gelände zu nutzen. In der Tat für jeden Web-Schlüssel erforderlich!

Google bietet einen kostenlosen Service, ein Unternehmen, Intranet-Lösungen und nutzt fortgeschritten ist - siehe: Google Maps für Unternehmen

Die kostenlose Version, aber in der bereits alle möglichen Bedürfnisse. Erhalten den Schlüssel wird automatisch vorgeschlagen eine Übersichtsseite mit einer JavaScript-Code-Beispiele. Der erste Schritt besteht darin, die Länge abrufen und den gewünschten Bereich, um latidudine.

JavaScript:
  1. showmap Funktion () (
  2. GBrowserIsCompatible ( ) ) { if (GBrowserIsCompatible ()) (
  3. new GMap2 ( document. getElementById ( "map" ) ) ; var map = new GMap2 (document getElementById ( "map"));
  4. new GLatLng ( 37.4419 , - 122.1419 ) , 13 ) ; Karte. setCenter (new GLatLng (37.4419, - 122,1419), 13);
  5. )
  6. )

Der Beispielcode ist ziemlich einfach. Sie basiert sull'instanza eine Klasse GMap2() um ein DIV auf der Seite verbunden, in diesem Fall ein DIV mit id="map"
Die vollständige Dokumentation der API bietet dann weitere Lebensmittel für die Anzeige, wie der Aufbau der Hybrid-Ansicht - / Sat-Karte - die Aktivierung der Kontrollen in und Reisen zu vergrößern, die Fähigkeit, eine "Wolke" mit maßgeschneiderten Richtungen zu verbinden.

Eine Möglichkeit, die Aktivierung einer Reihe von Prüfungen ist:

JavaScript:
  1. new GMap2 ( document. getElementById ( "map" ) ) ; var map = new GMap2 (document getElementById ( "map"));
  2. new GLatLng ( 37.4419 , - 122.1419 ) ; var center = new GLatLng (37.4419, - 122,1419);
  3. center , 17 , G_HYBRID_MAP ) ; // Mappa ibrida Karte. setCenter (Mitte, 17, G_HYBRID_MAP), / / Hybrid Karte
  4. new GMapTypeControl ( ) ) ; Karte. AddControl (neu GMapTypeControl ());
  5. new GLargeMapControl ( ) ) ; Karte. AddControl (neu GLargeMapControl ());
  6. new GScaleControl ( ) ) ; // Zomming Karte. AddControl (neu GScaleControl ()) / / Zomming

Sie können auch einen GMarker, ein "Ballon" mit weiteren Anleitungen und sie reagieren auf Mausklicks.

JavaScript:
  1. '<div class="td_testo"><strong>Prova Mio Nome</strong><br />Via Roma, 100<br />00100 - Roma, Italia</div><div class="menu"><a href="http://maps.google.com/maps?f=q&hl=it&q=Via+Roma,+42,+Roma&ie=UTF8&om=1&z=17&ll=41.851366,12.473409&spn=0.005786,0.013561&iwloc=A">Come arrivare da noi</a></div>' ; WINDOW_HTML var = '<div class="td_testo"> <strong> Tipp: Mein Name </ strong> <br /> Via Roma, 100 <br /> 00100 - Rom, Italien </ div> <div class = "menu" > <a href = "http://maps.google.com/maps?f=q&hl=it&q=Via+Roma, 42, + Rom & ie = UTF8 & om = 1 & z = 17 & ll = 41.851366,12.473409 & spn = 0.005786,0.013561 & om = A "> Wie erreichen Sie uns </ a> </ div> ';
  2. new GMarker ( center ) ; var marker = new GMarker (Mitte);
  3. marker ) ; Karte. addOverlay (marker);
  4. marker , 'click' , function ( ) { GEvent. AddListener (marker, 'click', function () (
  5. WINDOW_HTML ) ; Marker. openInfoWindowHtml (WINDOW_HTML);
  6. ));
  7. marker , 'infowindowclose' , function ( ) { GEvent. AddListener (marker, "infowindowclose ', function () (
  8. center , 2 ) ; Karte. recenterOrPanToLatLng (Mitte, 2);
  9. ));
  10. WINDOW_HTML ) ; Marker. openInfoWindowHtml (WINDOW_HTML);

Eine vollständige Dokumentation über die Website erfüllt alle unsere Wünsche, die Verwendung von speziellen Markern, JSON, Ajax und vieles mehr. Unter anderem werden Sie viele Beispiele für Code-Beispiele finden Sie direkt online. Ein Tool - kostenlos - für den Einsatz sofort!

Verwandte Post

War dieser Artikel hilfreich?: Per nientePocoAbbastanzaMoltoMoltissimo
Loading ... Loading ...

22 Kommentare zu "Wie setzen Google Map in ihre Web"

  1. getAvatar 1,0
    16. März 2008 Villa centopino:

    Ich kann ihn nicht einlassen die komische ... sehen Sie ein Beispiel oder mehr Informationen auf Italienisch dazu, wie Sie zu tun haben?
    Danke

  2. getAvatar 1,0
    17. März 2008 Giovambattista Fazioli:

    @ Villa Centopino: Das Beispiel ist in der Post angezeigt. Welches Problem haben Sie genau? Durch einen Fehler entdecken?

  3. getAvatar 1,0
    28. März 2008 Villa centopino:

    Hallo
    Ich legte der Ballon nicht das Kopieren und Einfügen, kein Fehler ...
    Aber ich beschlossen zu versuchen
    Hallo und vielen Dank

  4. getAvatar 1,0
    13. Mai 2008 Armando:

    Längen-und Breitengrad kann aus dem Namen der Stadt und der Straße abgeleitet werden?

  5. getAvatar 1,0
    14. Mai 2008 Google Maps: Der Weg zum Breiten-und Längengrad von einer Adresse | Undolog.com:

    [...] Dieses Mal habe ich Antwort auf einen Kommentar mit einem Beitrag, da das allgemeine Interesse. Armando fragte mich, ob es möglich war, über Google Maps erhalten Breiten-und Längengrade von [...]

  6. getAvatar 1,0
    26. Mai 2008 Alberto:

    Hallo,
    Ich brauche eine Hand.
    Ich möchte, dass mein Comic bereits, ohne die Maus-Klicks zu sehen war.
    Ich möchte auch die Komik enthält die Optionen "den Weg finden, um hier und hier.
    Es ist eine Woche, dass wir sbattola Kopf, gib mir ein manoper begünstigen.
    Thanks and see you soon

  7. getAvatar 1,0
  8. getAvatar 1,0
    Lug 02, 2008 Beppe:

    Hallo an alle Ich wollte fragen, warum die Adresse nicht angezeigt und nicht MARKATOR Mitrov Adresse ...

      (alert (address + "nicht gefunden");
     ....
    

    Ich schrieb also:

     ...
     onload = "load ();
     showAddress ( "Road Portichina, 20 55049 Viareggio LU, Italien ');"
     onunload = "GUnload ();"
     ......
    

    Vielen Dank

  9. getAvatar 1,0
    24. Oktober 2008 Bookmarks vom 18. Oktober bis 24. Oktober - Dexle:

    [...] Wie Google Map in ihre Web gestellt - heyos_ad_user = 8748; heyos_ad_type = "G"; heyos_ad_format = "8"; heyos_color_border = "000066"; heyos_color_bg = "FFFFFF"; heyos_color_link = "005B88"; heyos_color_text = " 000000 "; heyos_color_url =" 5F5F5F "; [...]

  10. getAvatar 1,0
    11. November 2008 Annahme eines Post | Undolog.com:

    [...] Beispiel, bleibt die Erinnerung an diese ein Schreiben der meistgesehenen Wie Google Map in ihre Web stellen mit 17410. mal gesehen. Wenn Sie Dienstleistungen oder Produkte zu Google Map bezogen oder zumindest, dass [...]

  11. getAvatar 1,0
    20. November 2008 Andreas:

    Hej!

    Till här är det helt ny med Google Maps API.
    Önskar jag hjälp med att få plats på de som krävs kod-Bitar. Önskar jag följande uppnå.

    Där man har en webbsida fyller der lite uppgifter, där bland annat Adresse, stad och land. Man klicka "submit" alle Informationen lagras och så klart i en databas.

    Min önskan, nu är att man på en visningssida skall kunna Klicka på en och då posten ihre Databasen hämtas Alle Informationen och Visa på en sida. Det som jag skall ske önskar, är att Visa en karta där man har en liten på nur den pin-point-Adresse, Ort och land som var registrerad för den Posten.

    HUR går jag för att skapa dass tillväga Stück och på ett bra sätt.
    Skriver och lite jobb mot PHP MySQL.

    Tacksam om någon hjälpa en önskar själ okunnig!

    - Andreas

  12. getAvatar 1,0
    20. November 2008 Giovambattista Fazioli:

    @ Andreas: Sehr geehrter Herr Andreas, schreiben Sie Ihre Frage in Englisch?

  13. getAvatar 1,0
    20. November 2008 Andreas:

    @ Giovambattista Fazioli:

    @ Andreas: Sehr geehrter Herr Andreas, schreiben Sie Ihre Frage in Englisch?

    Hallo!

    Sind völlig neu, dies mit der Google Maps API.
    Ich möchte dazu beitragen, die Code-Stück in Stelle wie man benötigt. Die folgenden möchte ich zu erreichen.

    Gibt es eine Website, wo Sie füllen Sie einige Daten, die unter anderem, Adresse, Stadt und Land. Sie klicken auf "Abschicken", und alle Informationen in einer Datenbank gespeichert, so klar.

    Mein Wunsch ist nun, dass auf einem Display-Seite ist ein Klick auf einen Eintrag in der Datenbank abgerufen und dann alle Informationen und auf einer Seite angezeigt. Ich wünsche mir geschehen wird, ist, dass eine Karte zeigt, wo Sie einen kleinen Pin-Nummer haben nur die Adresse, Stadt und Land, für das Amt registriert wurde.

    Wie gehe ich auf diese in eine einfache und nützliche Art und Weise zu erstellen.
    Schreibt ein wenig PHP und arbeitet mit MySQL.

    Ihnen dankbar, wenn jemand helfen wollten einen unwissenden Seele!

    -Andrew

  14. getAvatar 1,0
    19. Januar 2009 Giovambattista Fazioli:

    @ Dario: Bestellen Sie Reverse Geocoding. Ein Blick in die Quelle der Seite finden Sie den erforderlichen Code finden, ist comunqueq, den Kern der Lösung ist:
    Fügen Sie ein Listener abzufangen und klicken Sie auf die Schaffung eines GClientGeocoder

    JavaScript:
    1. map , "click" , getAddress ) ; GEvent. AddListener (map, "click", getAddress);
    2. GClientGeocoder ( ) ; geocoder = new GClientGeocoder ();

    Der Handler verwendet das Thema klicken Sie GClientGeocoder Informationen aus dem Startort von Längen-und Breitengrad abzurufen:

    JavaScript:
    1. overlay , latlng ) { Funktion getAddress (Overlay, latlng) (
    2. latlng != null ) { if (latlng = null) (
    3. address = latlng;
    4. latlng , showAddress ) ; geocoder. getLocations (latlng, showAddress);
    5. )
    6. )

    Dann endlich, der Handler showAddress zeigen Ihnen die Info des Ortes durch place.address

  15. getAvatar 1,0
    19. Januar 2009 Dario:

    Sie wundern sich, wenn Sie eine Website finden, dass Handlungen im Gegenteil, das heißt, die Eingabe der Koordinaten kann man den Ort zu finden.

  16. getAvatar 1,0
    21. Februar 2009 Angeliam:

    Hallo an alle!
    Ich bitte die Hand von Experten, weil ich lief in ein Problem, das ich nicht lösen kann ... Lassen Sie mich erklären:
    Verwende ich die Google Maps-API zu einem schiffbaren und zoombaren Karte mit Extension zu machen. Georeferenziert tiff das ist! Ich habe einige Informationen, mit denen ich realisiert habe, dass vor allem mein Bild muss in Kacheln aufgeteilt werden, nur die Ressourcen, die fand ich es so, dass ich diese mit Photoshop oder Paint Shop Pro (oder ein anderes Programm machen kann , denke ich), aber nicht mir sagen, wie ... und ich bin hier hängen geblieben!
    ... Bitte helfen Sie mir, ich brauche wirklich!

  17. getAvatar 1,0
    Der 03. März 2009 Claudio:

    Ola estou Queriendo passar meu mapa, ja feito em Earth und Google Maps API para, para poder ter ein visão em meu blog igual a um Google Earth, lokale em meu computador. Wenn und Posivel que, mas desconhesco como fazerlo. Poderiam mich dar algumas dicas de como fazer, oder procurar algum exemplo.
    Meu temor es que ter recadastrar cadastrado tudo em meu mapa, todos os warten Punkt.

    Grateful pela ajuda.

    Claudio G. Pagliaro
    cgpagliaro.arroba.gmail.com

  18. getAvatar 1,0
    20. März 2009 Henry beb:

    Hallo an alle, ich habe ein Problem, generated ich den Code von Google Maps API einfügen auf meiner Website. Lokal funktioniert ohne Probleme, aber wenn ich in ke Internet und gehen Sie auf die Seite zu besuchen, wo ich eingefügt das Wort aus ke Server-API und lehnt den Antrag ab, weil die API-Schlüssel ist ungültig, da sie für einen anderen generiert Website . Was soll ich tun?

  19. getAvatar 1,0
    20. März 2009 Giovambattista Fazioli:

    beb @ enrico: Sie können sich regenerieren der Schlüssel! Oder besser! Wenn Sie verwendet haben, die "lokale", behauptete, erzeugen Sie einen Schlüssel für eine Vielzahl anderer als online? Grundsätzlich müssen Sie einen Schlüssel erzeugen nach dem Server, der sie zu nutzen.

  20. getAvatar 1,0
    24. Juli 2009 Google Maps Werbung:

    [...] Ist wirklich trivial. Wir sehen sofort, das Skript Ausgangspunkt, um mit dem Standard-Verfahren zur Integration der Google-Karte in die Website eingefügt werden soll. Wir biegen Sie zunächst, wie man klassische Werbung und dann in der Symbolleiste von [...]

  21. getAvatar 1,0
    29. August 2009 Undolog.com »Wie die Verwendung von Google Maps in Adobe Flash CS4:

    [...] In Adobe Flash, können Sie ein breites Spektrum von externen APIs von Web-Services wie Facebook, Twitter und Flickr zur Verfügung gestellt. In diesem Tutorial werden wir sehen, wie zu integrieren, so sehr einfach, die Dienste von Google Maps in einem Film / application Adobe Flash CS4. Ich behaupte, dass das Verfahren, um Google Maps in Flash verwenden, um sehr ähnlich ist, was in HTML / Javascript (Details finden Sie unter Google Map in ihre Web-Put). [...]

  22. getAvatar 1,0
    "01, 2009 Undolog.com» Google Maps Komponente für Flash:

    [...] Zur Verfügung gestellt hat die API - in Javascript - seine Karten in jeder Website Viedo, wie die gleiche Sache mit zu erreichen, legen Sie [...]

Leave a comment

TAG XHTML Berechtigungen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERTION Art.-Nr.:
 <pre></pre>         // blocco generico [code][/code]       // blocco generico [as][/as]           // Actionscript [css][/css]         // CSS Style Sheet [html][/html]       // HTML [js][/js]           // Javascript [objc][/objc]       // Objective-C [php][/php]         // PHP [sql][/sql]         // SQL