öffentlich
Redaktion Druckversion

Google Maps für Ihre Website

4.833335
(6)
Beitrag bewerten
Kommentar schreiben
Stand: 30. August 2010

Marker einbinden und Orte kennzeichnen

Marker mit Tooltipp einfügen

Ein Marker mit Tooltipp

Ein Marker mit Tooltipp ist mit vier zusätzlichen Zeilen Code erstellt:

var marker = new google.maps.Marker({
  position: latlng,
  map: map,
  title: "Hallo München"
});  

Bei der Erstellung des Markers geben Sie drei Optionen an:

position bestimmt die Position des Markers. Im Beispiel soll die Position mit dem Mittelpunkt der Karte übereinstimmen. Und diesen hatten Sie bereits durch die folgende Zeile festgelegt:

var latlng = new google.maps.LatLng(48.13675, 11.57632);

Auf die vorher definierte Variable latlng greifen Sie beim Marker wieder zu.

Außerdem müssen Sie angeben, für welche Karte Sie den Marker erstellen. Im Beispiel ist dies map. Damit greifen Sie auf die vorher bei der Definition der Karte angegebene map zu:

var map = new google.maps.Map(document.getElementById("karte"), myOptions);

title setzt den Titel des Tooltipps. Schreiben Sie ihn unbedingt in Anführungszeichen.

Damit sieht der Code für die Beispielkarte samt Marker folgendermaßen aus:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Karte</title>
<style type="text/css">
  #karte { width: 400px; height: 400px;}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
function initialize() {
  var latlng = new google.maps.LatLng(48.13675, 11.57632);
  var myOptions = {
    zoom: 18,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.HYBRID
  };
  var map = new google.maps.Map(document.getElementById("karte"),  myOptions);
  var marker = new google.maps.Marker({
      position: latlng,
      map: map,
      title: "Hallo München"
  });
}
</script>
</head>
<body onload="initialize()">
  <div id="karte" ></div>
</body>
</html>

So sieht die Karte mit Marker ausAnzeigen:

Als Mitglied können Sie diesen Beitrag weiterlesen!

Werden Sie Mitglied und testen Sie akademie.de 14 Tage lang kostenlos!

In den ersten 14 Tagen haben Sie Zugriff auf alle Inhalte auf akademie.de, außer Downloads. Sie können in dieser Zeit ohne Angabe von Gründen stornieren. Eine E-Mail an service@akademie.de genügt. Nur wenn Sie Mitglied bleiben, wird der Mitgliedsbeitrag nach Ende der 14tägigen Stornofrist abgebucht.

Ich bin bereits Mitglied
Jetzt Mitglied werden und akademie.de 14 Tage kostenlos testen
Ich entscheide mich für folgende Zahlungsweise:
14 Tage Stornorecht:
Ich kann meine Mitgliedschaft in den ersten 14 Tagen jederzeit formlos stornieren, z.B. per E-Mail an service@akademie.de.

Inhalt

Downloads zu diesem Beitrag

Über die Autorin:

bild117864

Dr. Florence Maurice bietet Dienstleistungen im Webpublishing in Form von Fachtexten und Trainings (auch maßgeschneiderte Inhouse-Schulungen). Außerdem programmiert sie Webseiten. Ihre Themen: HTML, ...

Newsletter abonnieren