• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

googlemapsAPI - mehrere Marker mit Infotext verbinden

K

krokodil

Neues Mitglied
An die googlemapsAPI bzw. Javascript Profis :

Meine Anliegen ist das oben genannte: ich bin relativ neu in googlemapsAPI und auf javascript ein kompletter neuling:

Hintergrund-Info:
Ich habe mir eine Karte erstellt, mit einem Tutorial aus dem Web, und dort wurde zwar erklärt wie man mehrere Marker macht und wie man einen Marker mit einem Infotext verbindet ( also wenn man draufklickt, dass es einen Text gibt.) aber nicht wie man mehrere Marker mit Infotexten verbindet.

Ich hoffe ihr könnt mir helfen :)

Mfg Kroko
 
es geht eigentlich generell um die frage wie man mehrere markierungen auf der karte mit infotexten verbindet

Trotzdem der code:
HTML: 
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>P&auml;dagogischer Stadtplan Wiesbaden</title>

<link rel="stylesheet" href="screen.css" type="text/css" media="screen" /> <!--screen stylesheet -->

<style type="text/css">
  #karte { width: 400px; height: 400px;}
  background-image: url("hintergrund.gif") ;}
</style>

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
</script>

</head>
<body onload="initialize()">

  <div id="karte">
  <script type="text/javascript">
function initialize() {
  var latlng = new google.maps.LatLng(50.0796956, 8.2355189);
  var myOptions = {
    zoom: 12,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    navigationControl: true,
    mapTypeControl: true 
    
  };
  var map = new google.maps.Map(document.getElementById("karte"),  myOptions);
  setMarkers(map, beaches);
 }
  var beaches = [
  ['Wiesbadener Synagoge', 50.0836838, 8.2374322],
  ['Hessenpark', 50.2755009, 8.5233891],
  ['Stadtbibliothek', 50.0817265, 8.2399214]
];
function setMarkers(map, locations) {
  for (var i = 0; i < locations.length; i++) {
    var beach = locations[i];
    var myLatLng = new google.maps.LatLng(beach[1], beach[2]);
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        title: beach[0]
    });
  }
}
</script>
  </div>
</body>
</html>
 
vielen dank :)

tut mir leid dass ich erst so spät zurückschreibe (probleme wegen dem internet)

Nun, deine Antwort in die Tat umgesetzt ....
HTML: 
var beaches = [
  ['Wiesbadener Synagoge', 50.0836838, 8.2374322, 'Wiesbadener Synagoge Meldung'],
  ['Hessenpark', 50.2755009, 8.5233891, 'Hessenpark Meldung],
  ['Stadtbibliothek', 50.0817265, 8.2399214, 'Stadtbibliothek Meldung ']
];
... und ...

HTML: 
function addInfoWindow( marker, beach[3] ) {
            var info = message;

            var infoWindow = new google.maps.InfoWindow({
                content: message
            });

            google.maps.event.addListener(marker, 'click', function () {
                infoWindow.open(map, marker);
            });
        }

ist das so richtig ? Irgendwie wird nichts angezeigt

Trotzdem schon mal vielen dank
 
ich glaub ich verstehe nicht was du meinst, hättest du vielleicht einen beispiel-code, denn ich mir kopieren könnte (und dann anpassen) ? wie gesagt , ich kann (sogut wie) gar nix auf javascript

hatte leider noch nicht die zeit mir javascript beizubringen, bin grad an php und mysql dran :)
 
HTML: 
function setMarkers(map, locations) {
  for (var i = 0; i < locations.length; i++) {
    var beach = locations[i];
    var myLatLng = new google.maps.LatLng(beach[1], beach[2]);
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        title: beach[0]
 addInfoWindow( marker, beach[3] );        
    });
  }

so ? was bedeutet eigentlich diese 3 hinter beach ?
 
Ich dachte Du hast den restlichen JavaScript-Code selbst geschrieben? Dann sollte dir doch eigentlich bewusst sein, dass Variablen mit dahinterstehenden eckigen Klammern Arrays sind?!

Die Funktion ist btw. an der falschen Stelle. Es müsste außerhalb der Markers-Deklaration stehen, also nach "});".
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben