 Willkommen auf dem Portal für Mediengestalter
|
|
|
| Autor |
Nachricht |
qualidat
Threadersteller
Dabei seit: 14.09.2006
Ort: Eichwalde bei Berlin
Alter: 63
Geschlecht: 
|
Verfasst Mo 08.06.2015 15:35
Titel JS: Google Maps Marker - Infofenster ergänzen? |
  |
|
Kann mir mal bitte jemand helfen? Im folgenden Stück JS-Code werden aus Daten, die in einem Array "locations" stehen, Marker in eine Karte eingefügt. Das funktioniert. Wie müsste der Code ergänzt werden, um beim Klick auf einen Marker eine Info-Bubble ("Infofenster") mit weiteren Angaben zu öffnen? Irgendwas mit "addListener" ... aber alle Beispiele, die ich ausprobiert habe, funktionierten nicht. Syntaktisch waren sie wohl ok, denn das JS lief durch, es passiert nur Nichts beim Klick 
Das Problem ist - bitte bei Vorschlägen beachten - dass der Code nur bedingt änderbar ist (ergänzbar ja), weil er nicht klassisch geschrieben, sondern über eine Datenbank (FilemakerPro) dynamisch erzeugt wird. Jede grundlegende Änderung zieht einen ewigen Rattenschwanz anderer Änderungen nach sich.
Danke für Tips!
| Code: |
function initialize(count) {
var mapOptions = {zoom: 4};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
for (var i=0; i<count; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1],locations[i][2]),
map:map,
labelContent: locations[i][0],
title: locations[i][0],
icon: pin_sym(locations[i][3],locations[i][4])});
bounds.extend(new google.maps.LatLng(locations[i][1],locations[i][2])); }
map.fitBounds(bounds);
map.panToBounds(bounds); }
|
|
|
| |
   |
 |
qualidat
Threadersteller
Dabei seit: 14.09.2006
Ort: Eichwalde bei Berlin
Alter: 63
Geschlecht:
|
Verfasst Mo 08.06.2015 16:12
Titel
|
|
|
Ich habe das mal wie folgt ergänzt. Das bewirkt aber, dass das Infofenster sich zwar öffnet, aber immer nur bei einem Marker, egal, welchen man anklickt. Die Variablen marker und infowin als Array zu führen, habe ich auch probiert, hat aber auch nicht funktiniert ...
| Code: |
function initialize(count) {
var mapOptions = {zoom: 4};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
for (var i=0; i<count; i++) {
var infowin = new google.maps.InfoWindow({content:'bla test'}); //<= hier
var marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1],locations[i][2]),
map:map,
labelContent: locations[i][0],
title: locations[i][0],
icon: pin_sym(locations[i][3],locations[i][4])});
google.maps.event.addListener(marker,'click',function(){infowin.open(map,marker);}); //<= hier
bounds.extend(new google.maps.LatLng(locations[i][1],locations[i][2])); }
map.fitBounds(bounds);
map.panToBounds(bounds); } |
Zuletzt bearbeitet von qualidat am Mo 08.06.2015 16:13, insgesamt 2-mal bearbeitet
|
|
| |
|
|
|
Anzeige
|
|
|
JohnnyCage
Gesperrt
Dabei seit: 11.12.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mo 08.06.2015 18:10
Titel
|
|
|
infowin im event ist eine Referenz auf die infowin-Variable die zum Zeitpunkt des Klickens den Wert aus der letzten Iteration hat.
Versuch es anstelle von var infowin = und infowin.open(map… mit marker.infowin = und marker.infowin.open(map…
|
|
| |
|
|
JohnnyCage
Gesperrt
Dabei seit: 11.12.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mo 08.06.2015 20:42
Titel
|
|
|
|
Edit: marker innerhalb des events wird vermutlich mit this referenziert.
|
|
| |
|
|
JohnnyCage
Gesperrt
Dabei seit: 11.12.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 09.06.2015 11:34
Titel
|
|
|
|
Schon gut. Nichts zu danken. Habe ich gerne gemacht.
|
|
| |
|
|
qualidat
Threadersteller
Dabei seit: 14.09.2006
Ort: Eichwalde bei Berlin
Alter: 63
Geschlecht:
|
Verfasst Di 09.06.2015 12:14
Titel
|
|
|
| JohnnyCage hat geschrieben: | | Schon gut. Nichts zu danken. Habe ich gerne gemacht. |
bin z.Zt. unterwegs, noch nicht zum Testen gekommen ... gegen 17/18 Uhr vlt.
|
|
| |
|
|
qualidat
Threadersteller
Dabei seit: 14.09.2006
Ort: Eichwalde bei Berlin
Alter: 63
Geschlecht:
|
Verfasst Di 09.06.2015 22:18
Titel
|
|
|
Danke der Mühe, geht!
Hättest du noch einen Vorschlag, wie man alle offenen Infofenster schließt, bevor sich ein neues öffnet? Jeder Klick öffnet nun ein neues Fenster, schließen muss man sie derzeit manuell.
| Code: | function initialize(count) {
var mapOptions = {zoom: 4};
var map=new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
for (var i=0; i<count; i++) {
var marker=new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1],locations[i][2]),
map:map,
labelContent: locations[i][0],
title: locations[i][0],
icon: pin_sym(locations[i][3],locations[i][4])});
marker.infowin=new google.maps.InfoWindow({content:'bla bla blub. '+i});
google.maps.event.addListener(marker,'click',function(){this.infowin.open(map,this);});
bounds.extend(new google.maps.LatLng(locations[i][1],locations[i][2])); }
map.fitBounds(bounds);
map.panToBounds(bounds); }
|
Zuletzt bearbeitet von qualidat am Di 09.06.2015 22:25, insgesamt 3-mal bearbeitet
|
|
| |
|
|
JohnnyCage
Gesperrt
Dabei seit: 11.12.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 09.06.2015 23:47
Titel
|
|
|
Das müsste funktionieren.
| Code: |
function initialize(count) {
var openInfoWin = null;
[...]
google.maps.event.addListener(marker,'click',function(){
if(openInfoWin){
openInfoWin.schließenFunktionDerGoogleMapsApi();
}
openInfoWin = this.infowin;
this.infowin.open(map,this);
});
[...] |
Also, eine Variable in der outter-function definieren der dann beim Klick die entsprechende, sich öffnende infowin zuweist und beim nächsten Klick dann wieder abrufen und schließen kannst.
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
google maps api und eigener marker
Google Maps Map-Marker verwenden
Google Maps: Mehrere Marker per URL-Aufruf?
Google Kontakte auf Google Maps auslesen/anzeigen lassen
Google Maps und Google Places
Google Maps API
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|
