Sidemap in GMap - Erweiterung will nicht


sid61

Mitglied
Hallo,

bei meinem Versuch, meine Sitemap zu erweitern, bin ich auf ein neues Problem gestoßen, was ich irgendwie nicht in den Griff bekomme.

Ich benutze eine ähnliche Routine zum Clustern der Marker einem Beispiel folgend (Serverside Clustering) von (PHP&GMAPS) von UWmike (was aber mehr den hier nicht veröffentlichten Teil des Clusterns betrifft). Das Clustern selber ist hierbei auch nicht mein Problem, sondern mehr die Tatsache, das es nun eben eine dynamische Darstellung ist, die nicht wie bei anderen Beispielen - statisch - ist. Durch das Clustern wird jedesmal die Map neu aufgebaut, sobald sich die Koordinaten des dargestellten Sichtbereiches verändern.

Diese Routine habe ich erfolgreich an meine Wünsche anpassen können und nunmehr habe ich noch eine Sitemap eingebaut, welche mir die Links der aufgeführten Marker anzeigt. Soweit funktioniert es und die Links werden korrekt eingetragen.

Das Beispiel dem ich gefolgt bin, beschäftigt sich aber bei der Sidebar mit einer statischen Map, bei der die Marker vor dem Laden der Seite feststehen und sich nicht mehr verändern.
Bei mir ist es aber so, das die Marker unter bestimmten (einstellbaren) Bedingungen eben zu Cluster werden. Auch die werden mir korrekt in der Sidebar angezeigt.

Wenn ich nun auf der Map einen Cluster oder einen Marker anklicke, dann wird er mir auch korrekt gelb hinterlegt (markiert). Aber die Markierung wird nicht gelöscht, wenn ich einen anderen Marker anklicke - er markiert dann einfach den nächsten Marker.
Mit Glog wird mir eigentlich alles richtig angezeigt, so das ich nur vermute - das innerhalb der Routine was geändert werden muss, damit die Sidebar bei Veränderung komplett neu aufgelegt wird und die Inhalte zurückgesetzt werden (array). Soweit mein ich es kapiere, durchläuft beim Neuaufbau aber diese Routine jedesmal den Punkt, an dem die Werte der Sidebar neutral gesetzt werden (initialisierung)

Szenario...

wenn ich nun die Map verschiebe oder einen Cluster Marker zoome, dann wird der alte Eintrag in der Sidemap nicht gelöscht, sondern nur die gleichen, bzw. neuen Marker erneut unten in der Liste angefügt. Der alte Inhalt wird nicht gelöscht.

Die Markierung des Markers wird beim anklicken eines anderen Markers nicht gelöscht, sondern der neue Marker wir nur zusätzlich markiert.

Die Klickroutine von der Sidebar reagiert überhaupt nicht und zeigt mir nicht den betreffenden Marker, obwohl der Link und die Linkadresse zum Marker korrekt gesetzt wird.

Hier ist meine map_functions.js, mit der ich diese Vorgänge steuere...

Code:
//Werte setzen
var map; 
var centerLatitude = 51.49506473014368;
var centerLongitude = 10.37109375;
var startZoom = 6;


//Erstelle Icon für Cluster
var iconCluster = new GIcon();
iconCluster.image = "http://www.tutorials.de/forum/images/cluster.png";
iconCluster.shadow = "http://www.tutorials.de/forum/images/house_trans.png";
iconCluster.iconSize = new GSize(48, 38);
iconCluster.shadowSize = new GSize(47, 37);
iconCluster.iconAnchor = new GPoint(23, 35);
iconCluster.infoWindowAnchor = new GPoint(23, 1);
iconCluster.infoShadowAnchor = new GPoint(26, 13);

//Erstelle Icon Detailmarker
var iconSingle = new GIcon();
iconSingle.image = "http://www.tutorials.de/forum/images/house.png";
iconSingle.shadow = "http://www.tutorials.de/forum/images/house_trans.png";
iconSingle.iconSize = new GSize(20, 20);
iconSingle.shadowSize = new GSize(23, 20);
iconSingle.iconAnchor = new GPoint(13, 25);
iconSingle.infoWindowAnchor = new GPoint(13, 1);
iconSingle.infoShadowAnchor = new GPoint(26, 13);


function windowHeight() {
	// Standard browsers (Mozilla, Safari, etc.)
	if (self.innerHeight)
		return self.innerHeight;
	// IE 6
	if (document.documentElement && document.documentElement.clientHeight)
		return document.documentElement.clientHeight;
	// IE 5
	if (document.body)
		return document.body.clientHeight;
	// Just in case.
	return 0;
}

function handleResize() {
	var height = windowHeight() - document.getElementById('toolbar').offsetHeight - 30;
	document.getElementById('map').style.height = height + 'px';
	document.getElementById('sidebar').style.height = height + 'px';
}

function changeBodyClass(from, to) {
     document.body.className = document.body.className.replace(from, to);
     return false;
}


//Initialisieren
function init() {
       document.getElementById('button-sidebar-show').onclick = function() { return changeBodyClass('nosidebar', 'sidebar-right'); };
	document.getElementById('button-sidebar-hide').onclick = function() { return changeBodyClass('sidebar-right', 'nosidebar'); };
	
	handleResize();       
       map = new GMap2(document.getElementById("map"));
	

// zusätzlicher Layer für Markierung auf Karte
var crossLayer = new GTileLayer(new GCopyrightCollection(""), 0, 15);

crossLayer.getTileUrl =  function(tile, zoom) {
  return "http://www.tutorials.de/forum/images/tile_crosshairs.png";
}
crossLayer.isPng = function() {return true;}
map.addMapType(G_SATELLITE_3D_MAP);
// Erstelle neuen Map Typ
var layerTerCross = [ G_PHYSICAL_MAP.getTileLayers()[0], crossLayer ];
var mtTerCross = new GMapType(layerTerCross,
 G_PHYSICAL_MAP.getProjection(), "Ter+");

map.addMapType(G_PHYSICAL_MAP);
map.addMapType(mtTerCross);
var mapControl = new GHierarchicalMapTypeControl();

// Setup Map Typ - und Partnerschaft
mapControl.clearRelationships();
mapControl.addRelationship(G_SATELLITE_MAP, G_HYBRID_MAP, "Labels", false);
mapControl.addRelationship(G_PHYSICAL_MAP, mtTerCross, "Crosshairs");

// Map Control setzen
map.addControl(mapControl);

//Neuen YSlider setzen (Grafischer Slider)
map.addControl(new GLargeMapControl());
map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom);
             
updateMarkers();


	// Event setzen
	GEvent.addListener(map,'moveend',function() {
		updateMarkers();
	});
   
    
       // Hintergrund Hinweis -Lade Daten ect.
       document.getElementById("map").style.backgroundImage = "url(images/loading.jpg)"; 

	//alert('Test: Testmarke - Hier bin ich');
}

function updateMarkers() {

	//existierende Punkte löschen
	map.clearOverlays();

	//Filter für Coords setzen
	var bounds = map.getBounds();
	var southWest = bounds.getSouthWest();
	var northEast = bounds.getNorthEast();
	var getVars = 'ne=' + northEast.toUrlValue()
	+ '&sw=' + southWest.toUrlValue()

	//TEST - Url loggen für Datentest
	//GLog.writeUrl('server.php?'+getVars);
    
	//Geografische Punkte auslesen
	var request = GXmlHttp.create();
	request.open('GET', 'server.php?'+getVars, true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			var jscript = request.responseText;
			var points;
 			eval(jscript);

			//Jetzt die Werte in geordnete Liste eintragen
			for (i in points) {
                           // Längen und Breitengrad zusammenfassen
                          	var point = new GLatLng(points[i].lat,points[i].lng);
				// Variable html Infofenster vorbereiten
                           var html;
				// variable marker mit Dateninhalt vorbereiten
                          	var marker = createMarker(point, html, points[i].lat, points[i].lng, points[i].type, points[i].id, points[i].address, points[i].state, points[i].postcode, points[i].price, points[i].name, points[i].art, points[i].category, points[i].agent, points[i].agentphone, points[i].thumb);

                   map.addOverlay(marker);
			}
		}
	}
	request.send(null);
}

    
      // Variable für Sitebar vorbereiten, die später die Daten der Marker spiegelt.
      // Initialisiere und setze auf null
      var sidebar_html = "";
    
      // Array für Kopien der Markerinhalte setzen
      var gmarkers = [];
      var li = 0;
      var lastlinkid;
	   
     
	function createMarker(point, html, lat, lng, type, id, address, state, postcode, price, name, art, category,agent, agentphone, thumb) {
	//Erstelle verschiedene Marker, je nachdem, ob es ein Cluster ist oder nicht.
       if(type=='c') {
       		// Marker ist ein Cluster, setze Info Fenster Parameter
			   var html = "<div style='height: 110px; width: 305px; line-height:120%; font-family: verdana; font-size: 10px'>";
                   	html +="<img style='float: left; margin-right: 3px' src='/images/find.png' alt='Ansicht Foto' /><div style='float: right'>";
               // O.K. - Jetzt übergeben wir Daten an die Infofelder und organisieren die Ausgabe.
			   html += "<strong><h1>Cluster Icon</strong></h1>";
			   html += "<strong>This Cluster have " + name + " Entrys<br>Geocoords: " + lat + "," + lng +" </strong><br /><hr>";
			   html += "GPoint is: " + map.fromLatLngToDivPixel(point) + ", zoom level is " + map.getZoom() + "<hr>";
               // Hier geben wir einen Link vor, der den Cluster soweit zoomt, das die normalen Marker erkennbar sind..
			   html += "<a href=\"javascript:void(0)\" onclick=\"map.setCenter(new GLatLng(" + lat + "," + lng +"), 9);\">Show Objects</a>";
	// jetzt bekommt der Marker sein Icon und einen Titel                    	              
       var marker = new GMarker(point,{icon:iconCluster, title:"Cluster"});
       // Hier wird für jedes Icon eine Link ID gesetzt, um es in der Sidebar richtig abzulegen
       var linkid = "link"+li;
	// Ereignisüberwachung - zeige mir das Infofenster auf Klick
	GEvent.addListener(marker, 'click', function() {
	// html nun komplett nach markerHTML übergeben
	var markerHTML = html;
	// Nun Infofenster für Marker öffnen und definiertes markerHTML anzeigen.
	marker.openInfoWindowHtml(markerHTML);
  	// die linkid in Sidebar markieren
	// Problem hier - die alte Linkid wird nicht mehr auf neutralen Hintergrund gesetzt, 
	// wenn ich einen anderen Marker setze.
       document.getElementById(linkid).style.background="#ffff00";
	// letzten angeklickten Marker merken
       lastlinkid=linkid;

});
	
       // Oder es ist ein normales Icon und kein Clustericon
       } else {

	// Marker ist kein Cluster, setze Info Fenster Parameter
       var html = "<div style='height: 110px; width: 305px; line-height:120%; font-family: verdana; font-size: 10px'>";
                   	html +="<img style='float: left; margin-right: 3px' src='http://meinedomain.eu/components/com_wohnraum24/img/thb/"+ thumb +"' alt='Ansicht Foto' /><div style='float: left'>";  
			// O.K. - Jetzt übergeben wir Daten an die Infofelder und organisieren die Ausgabe.
			html += "<strong>" + name + "</strong><br />";
			html += "<HR>";
			html += "<strong>Objekt Typ: </strong>" + category +"<br />";
			html += "<strong>Price: </strong>" + price + " €uro<br />";
			html += "<HR>";
			html += address + '<br />';
			html += postcode + '&nbsp;' + state + '<br /><br />';
    		html += "<a style='color: #FF9900' target=\"_blank\" href=\"http://meinedomain.eu/index.php?option=com_wohnraum24&task=view&id="+id+"\">[Detail Ansicht]</a>";

	// jetzt bekommt der Marker sein Icon und einen Titel
       var marker = new GMarker(point,{icon:iconSingle, title:"Icon"});
	// Hier wird für jedes Icon eine Link ID gesetzt, um es in der Sidebar richtig abzulegen
       var linkid = "link"+li;
	// Ereignisüberwachung - zeige mir das Infofenster auf Klick
	GEvent.addListener(marker, 'click', function() {
	// html nun komplett nach markerHTML übergeben
	var markerHTML = html;
	// Nun Infofenster für Marker öffnen und definiertes markerHTML anzeigen.
	marker.openInfoWindowHtml(markerHTML);
	// die linkid in Sidebar markieren
	// Problem hier - die alte Linkid wird nicht mehr auf neutralen Hintergrund gesetzt, 
	// wenn ich einen anderen Marker setze.
       document.getElementById(linkid).style.background="#ffff00";
	// letzte angeklickte linkid merken
       lastlinkid=linkid;
});	
	
       }      
        //Erzeugte marker für sidebar abfertigen	
        gmarkers[li] = marker;
        // Jetzt die Daten zufügen, die in der Sidebar angezeigt werden sollen
        // Problem:der Link für myclick wird gesetzt aber reagiert nicht
        sidebar_html += '<div id="' + linkid + '"><a href="javascript:myclick(' + li + ')">' + name + '/' + linkid +'</a><br></div>';
        // Eintragswert i erhöhen
        li++;

	 //Jetzt wird der erzeugte Eintrag in die Sidebar transportiert    
        document.getElementById("sidebar").innerHTML = sidebar_html;
        //Nochmal ein Test, ob alles ankommt !!
        GLog.write(sidebar_html);
          
        // alles klar, dann zurück zum nächsten Marker und alles von vorne..
        return marker;
     
        
        // Alle Marker abgefertigt - Dann raus aus der Schleife


       // Meine Problemzone - Normalerweise möchte ich mit dieser Funktion abfragen, welcher Link in der 
	// Sidbar geklickt wurde. Aber auf Klick in der Sidebar geht nix. 

        function myclick(li) {
        GEvent.trigger(gmarkers[li], "click");
        gmarkers[li].openInfoWindowHtml(markerHTML)
}   

}
        

window.onresize = handleResize;
window.onload = init;

Was mache ich falsch

Kann mir jemand was dazu sagen

Liebe Grüße
Sven
 
Zuletzt bearbeitet:

kuddeldaddeldu

Erfahrenes Mitglied
Hi,

warum die Links in der Sidebar nicht funktionieren, kann ich Dir auf den ersten Blick nicht sagen (hab gerade nicht so viel Zeit). Schau mal, ob die FF-Fehlerkonsole was sagt.

Der Hintergrund des zuletzt geklickten Links wird nicht zurückgesetzt, weil das schlicht und einfach fehlt ;)
Ich habe die Zeilen mal dazugesetzt:

Code:
//Werte setzen
var map; 
var centerLatitude = 51.49506473014368;
var centerLongitude = 10.37109375;
var startZoom = 6;


//Erstelle Icon für Cluster
var iconCluster = new GIcon();
iconCluster.image = "http://www.tutorials.de/forum/images/cluster.png";
iconCluster.shadow = "http://www.tutorials.de/forum/images/house_trans.png";
iconCluster.iconSize = new GSize(48, 38);
iconCluster.shadowSize = new GSize(47, 37);
iconCluster.iconAnchor = new GPoint(23, 35);
iconCluster.infoWindowAnchor = new GPoint(23, 1);
iconCluster.infoShadowAnchor = new GPoint(26, 13);

//Erstelle Icon Detailmarker
var iconSingle = new GIcon();
iconSingle.image = "http://www.tutorials.de/forum/images/house.png";
iconSingle.shadow = "http://www.tutorials.de/forum/images/house_trans.png";
iconSingle.iconSize = new GSize(20, 20);
iconSingle.shadowSize = new GSize(23, 20);
iconSingle.iconAnchor = new GPoint(13, 25);
iconSingle.infoWindowAnchor = new GPoint(13, 1);
iconSingle.infoShadowAnchor = new GPoint(26, 13);


function windowHeight() {
	// Standard browsers (Mozilla, Safari, etc.)
	if (self.innerHeight)
		return self.innerHeight;
	// IE 6
	if (document.documentElement && document.documentElement.clientHeight)
		return document.documentElement.clientHeight;
	// IE 5
	if (document.body)
		return document.body.clientHeight;
	// Just in case.
	return 0;
}

function handleResize() {
	var height = windowHeight() - document.getElementById('toolbar').offsetHeight - 30;
	document.getElementById('map').style.height = height + 'px';
	document.getElementById('sidebar').style.height = height + 'px';
}

function changeBodyClass(from, to) {
     document.body.className = document.body.className.replace(from, to);
     return false;
}


//Initialisieren
function init() {
       document.getElementById('button-sidebar-show').onclick = function() { return changeBodyClass('nosidebar', 'sidebar-right'); };
	document.getElementById('button-sidebar-hide').onclick = function() { return changeBodyClass('sidebar-right', 'nosidebar'); };
	
	handleResize();       
       map = new GMap2(document.getElementById("map"));
	

// zusätzlicher Layer für Markierung auf Karte
var crossLayer = new GTileLayer(new GCopyrightCollection(""), 0, 15);

crossLayer.getTileUrl =  function(tile, zoom) {
  return "http://www.tutorials.de/forum/images/tile_crosshairs.png";
}
crossLayer.isPng = function() {return true;}
map.addMapType(G_SATELLITE_3D_MAP);
// Erstelle neuen Map Typ
var layerTerCross = [ G_PHYSICAL_MAP.getTileLayers()[0], crossLayer ];
var mtTerCross = new GMapType(layerTerCross,
 G_PHYSICAL_MAP.getProjection(), "Ter+");

map.addMapType(G_PHYSICAL_MAP);
map.addMapType(mtTerCross);
var mapControl = new GHierarchicalMapTypeControl();

// Setup Map Typ - und Partnerschaft
mapControl.clearRelationships();
mapControl.addRelationship(G_SATELLITE_MAP, G_HYBRID_MAP, "Labels", false);
mapControl.addRelationship(G_PHYSICAL_MAP, mtTerCross, "Crosshairs");

// Map Control setzen
map.addControl(mapControl);

//Neuen YSlider setzen (Grafischer Slider)
map.addControl(new GLargeMapControl());
map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom);
             
updateMarkers();


	// Event setzen
	GEvent.addListener(map,'moveend',function() {
		updateMarkers();
	});
   
    
       // Hintergrund Hinweis -Lade Daten ect.
       document.getElementById("map").style.backgroundImage = "url(images/loading.jpg)"; 

	//alert('Test: Testmarke - Hier bin ich');
}

function updateMarkers() {

	//existierende Punkte löschen
	map.clearOverlays();

	//Filter für Coords setzen
	var bounds = map.getBounds();
	var southWest = bounds.getSouthWest();
	var northEast = bounds.getNorthEast();
	var getVars = 'ne=' + northEast.toUrlValue()
	+ '&sw=' + southWest.toUrlValue()

	//TEST - Url loggen für Datentest
	//GLog.writeUrl('server.php?'+getVars);
    
	//Geografische Punkte auslesen
	var request = GXmlHttp.create();
	request.open('GET', 'server.php?'+getVars, true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			var jscript = request.responseText;
			var points;
 			eval(jscript);

			//Jetzt die Werte in geordnete Liste eintragen
			for (i in points) {
                           // Längen und Breitengrad zusammenfassen
                          	var point = new GLatLng(points[i].lat,points[i].lng);
				// Variable html Infofenster vorbereiten
                           var html;
				// variable marker mit Dateninhalt vorbereiten
                          	var marker = createMarker(point, html, points[i].lat, points[i].lng, points[i].type, points[i].id, points[i].address, points[i].state, points[i].postcode, points[i].price, points[i].name, points[i].art, points[i].category, points[i].agent, points[i].agentphone, points[i].thumb);

                   map.addOverlay(marker);
			}
		}
	}
	request.send(null);
}

    
      // Variable für Sitebar vorbereiten, die später die Daten der Marker spiegelt.
      // Initialisiere und setze auf null
      var sidebar_html = "";
    
      // Array für Kopien der Markerinhalte setzen
      var gmarkers = [];
      var li = 0;
      var lastlinkid;
	   
     
	function createMarker(point, html, lat, lng, type, id, address, state, postcode, price, name, art, category,agent, agentphone, thumb) {
	//Erstelle verschiedene Marker, je nachdem, ob es ein Cluster ist oder nicht.
       if(type=='c') {
       		// Marker ist ein Cluster, setze Info Fenster Parameter
			   var html = "<div style='height: 110px; width: 305px; line-height:120%; font-family: verdana; font-size: 10px'>";
                   	html +="<img style='float: left; margin-right: 3px' src='/images/find.png' alt='Ansicht Foto' /><div style='float: right'>";
               // O.K. - Jetzt übergeben wir Daten an die Infofelder und organisieren die Ausgabe.
			   html += "<strong><h1>Cluster Icon</strong></h1>";
			   html += "<strong>This Cluster have " + name + " Entrys<br>Geocoords: " + lat + "," + lng +" </strong><br /><hr>";
			   html += "GPoint is: " + map.fromLatLngToDivPixel(point) + ", zoom level is " + map.getZoom() + "<hr>";
               // Hier geben wir einen Link vor, der den Cluster soweit zoomt, das die normalen Marker erkennbar sind..
			   html += "<a href=\"javascript:void(0)\" onclick=\"map.setCenter(new GLatLng(" + lat + "," + lng +"), 9);\">Show Objects</a>";
	// jetzt bekommt der Marker sein Icon und einen Titel                    	              
       var marker = new GMarker(point,{icon:iconCluster, title:"Cluster"});
       // Hier wird für jedes Icon eine Link ID gesetzt, um es in der Sidebar richtig abzulegen
       var linkid = "link"+li;
	// Ereignisüberwachung - zeige mir das Infofenster auf Klick
	GEvent.addListener(marker, 'click', function() {
	// html nun komplett nach markerHTML übergeben
	var markerHTML = html;
	// Nun Infofenster für Marker öffnen und definiertes markerHTML anzeigen.
	marker.openInfoWindowHtml(markerHTML);
  	// die linkid in Sidebar markieren
	// Problem hier - die alte Linkid wird nicht mehr auf neutralen Hintergrund gesetzt, 
	// wenn ich einen anderen Marker setze.
       document.getElementById(linkid).style.background="#ffff00";
       document.getElementById(lastlinkid).style.background="#ffffff";
	// letzten angeklickten Marker merken
       lastlinkid=linkid;

});
	
       // Oder es ist ein normales Icon und kein Clustericon
       } else {

	// Marker ist kein Cluster, setze Info Fenster Parameter
       var html = "<div style='height: 110px; width: 305px; line-height:120%; font-family: verdana; font-size: 10px'>";
                   	html +="<img style='float: left; margin-right: 3px' src='http://meinedomain.eu/components/com_wohnraum24/img/thb/"+ thumb +"' alt='Ansicht Foto' /><div style='float: left'>";  
			// O.K. - Jetzt übergeben wir Daten an die Infofelder und organisieren die Ausgabe.
			html += "<strong>" + name + "</strong><br />";
			html += "<HR>";
			html += "<strong>Objekt Typ: </strong>" + category +"<br />";
			html += "<strong>Price: </strong>" + price + " €uro<br />";
			html += "<HR>";
			html += address + '<br />';
			html += postcode + '&nbsp;' + state + '<br /><br />';
    		html += "<a style='color: #FF9900' target=\"_blank\" href=\"http://meinedomain.eu/index.php?option=com_wohnraum24&task=view&id="+id+"\">[Detail Ansicht]</a>";

	// jetzt bekommt der Marker sein Icon und einen Titel
       var marker = new GMarker(point,{icon:iconSingle, title:"Icon"});
	// Hier wird für jedes Icon eine Link ID gesetzt, um es in der Sidebar richtig abzulegen
       var linkid = "link"+li;
	// Ereignisüberwachung - zeige mir das Infofenster auf Klick
	GEvent.addListener(marker, 'click', function() {
	// html nun komplett nach markerHTML übergeben
	var markerHTML = html;
	// Nun Infofenster für Marker öffnen und definiertes markerHTML anzeigen.
	marker.openInfoWindowHtml(markerHTML);
	// die linkid in Sidebar markieren
	// Problem hier - die alte Linkid wird nicht mehr auf neutralen Hintergrund gesetzt, 
	// wenn ich einen anderen Marker setze.
       document.getElementById(linkid).style.background="#ffff00";
       document.getElementById(lastlinkid).style.background="#ffffff";
	// letzte angeklickte linkid merken
       lastlinkid=linkid;
});	
	
       }      
        //Erzeugte marker für sidebar abfertigen	
        gmarkers[li] = marker;
        // Jetzt die Daten zufügen, die in der Sidebar angezeigt werden sollen
        // Problem:der Link für myclick wird gesetzt aber reagiert nicht
        sidebar_html += '<div id="' + linkid + '"><a href="javascript:myclick(' + li + ')">' + name + '/' + linkid +'</a><br></div>';
        // Eintragswert i erhöhen
        li++;

	 //Jetzt wird der erzeugte Eintrag in die Sidebar transportiert    
        document.getElementById("sidebar").innerHTML = sidebar_html;
        //Nochmal ein Test, ob alles ankommt !!
        GLog.write(sidebar_html);
          
        // alles klar, dann zurück zum nächsten Marker und alles von vorne..
        return marker;
     
        
        // Alle Marker abgefertigt - Dann raus aus der Schleife


       // Meine Problemzone - Normalerweise möchte ich mit dieser Funktion abfragen, welcher Link in der 
	// Sidbar geklickt wurde. Aber auf Klick in der Sidebar geht nix. 

        function myclick(li) {
        GEvent.trigger(gmarkers[li], "click");
        gmarkers[li].openInfoWindowHtml(markerHTML)
}   

}
        

window.onresize = handleResize;
window.onload = init;

Du musst die Farbe noch anpassen, habe mal weiß genommen...

LG
 

sid61

Mitglied
Hallo Kuddeldaddeldu,

zuerst einmal danke für deine Zeilen, ich habe das mal so übernommen, aber leider
löst es das Problem auch nicht. Die Markierungen bleiben einfach gelb und werden nicht zurück gesetzt.

Gruss
Sven

P.S.
Ich schau auch mir auch noch mal eine Demo an, wo ich das gesehen hatte - aber da war es so, das es eben mit statischen Markern gesetzt wurde, also sich nicht mehr verändert, selbst wenn der Kartenausschnitt verschoben oder gezoomt wird.

Ich glaube, das es irgendwie damit zusammen hängen muss, das ich die Karte immer wieder aktualisiere, je nachdem, welche Marker angezeigt werden und wie Sie angezeigt werden (Cluster oder Normal)..

Wenn ich mit FF nachschaue, sagt er mir, das der jeweilige Marker nicht definiert sei - also p1, p2, p3, p4, u.s.w. - was ich aber nicht verstehe, denn er wird ja definiert - irgendwie scheint er das aber zu ignorieren

Wenn dir dazu aber noch was einfällt, würde ich mich über Hilfe aber freuen..

Liebe Grüße
Sven
 
Zuletzt bearbeitet:

sid61

Mitglied
Hallo Kuddeldaddeldu,

habe nachdem ich deinen Hinweis ausgeführt hatte dann die Funktion zur Sidebar nutzen können. Heute konnte ich auch mein Problem lösen, das die Sidebar ebenfalls immer wieder neu aufgebaut wird, wenn ich die Map verschiebe, oder die Marker sich verändern.
Das klappt jetzt echt gut *freu*

Aber nun wieder...

Beide Browser zeigen mir jetzt einen Fehler an für die Zeile:
Code:
 function myclick(i) {
        GEvent.trigger(gmarkers[i], "click");
        gmarkers[i].openInfoWindowHtml(markerHTML)
}
Die Fehlermeldung besagt, das markerHTML nicht definiert ist. Aber das kann doch eigentlich nicht sein, denn auf Klick wird mir ja der Inhalt von markerHTML ausgegeben.
Wenn es nicht definiert wäre, dann dürfte er mir doch auch eigentlich garnix ausgeben ?

Angezeigt wird trotzdem richtig - aber warum der Fehler ?

Leider komme ich mit -

Code:
 lastlinkid=linkid;    
         document.getElementById(linkid).style.background="#ffff00";
         document.getElementById(lastlinkid).style.background="#ffffff";

auch nicht wirklich weiter. Ich habe heute mal einige Variationen ausprobiert, aber irgendwie erzeuge ich nur völlig neue Picasso Variationen :rolleyes:

Dann habe ich meine Nase in meine mittlerweile üppige Büchersammlung gesteckt - leider mit nur mäßigem Erfolg. Irgendwie fehlt immer ein Echtzeit-Austausch von Gedanken und Wissen ;-)

Na gut, bevor ich nun geteert und gefedert aus diesem Beitrag getragen werde...

nerve ich nochmal,

liebe Grüße
Sid
 
Zuletzt bearbeitet:

Sven Mintel

Mitglied
Moin,

ich muss gestehen, dass es nicht gerade ein Spass ist, in deinem Code dort herumzuwühlen :eek:

Auf Anhieb kann ich dir aber sagen, dass markerHTML keine global verfügbare Variable ist...als solches willst du aber darauf zugreifen.

Wenn du für jeden Marker ein eigenes Attribut "markerHTML" benötigst, dann musst du diese auch diesem Marker zuweisen, und sie beim Funktionsaufruf per
Code:
gmarkers[li].openInfoWindowHtml(gmarkers[li].markerHTML)
als Parameter übergeben.
 

sid61

Mitglied
Hi,
habe ich gleich ausprobiert, der Fehler war zwar weg - aber dafür gabs nur noch leere InfoBubbles in der Ausgabe.

Das scheint irgendwie immer noch der Wurm drin zu sein. Ich werde mich aber nochmal vom Demo inspirieren lassen, aber das Problem dort ist, das es eben von Beginn an feststehende Marker sind. In meinem Fall werden diese ja entweder zu Clustern zusammengefasst oder es werden mal mehr und mal weniger Marker, je nachdem - welchen Kartenausschnitt ich betrachte. Der Server aktualisiert dann die Einträge und somit auch den Inhalt der Markerbubbles.

Ich probier das nochmal aus und versuche mal das ganze ein wenig zu verändern. Vielleicht kann ich ja dann mit einem neuen Ansatz dazu hier antreten..

Liebe Grüße
Sven

P.S.
 

sid61

Mitglied
On Click Event Fehler beseitigt

Hallo,

ich konnte meinen OnClick Fehler beseitigen...
Nach drei Tagen dann ein erfrischendes Erlebnis ;-)

Dennoch ein "BIG" Danke an Sven Mintel...

Jetzt habe ich nur noch das kleine Übel mit der Markierung, die dann nicht zurück gesetzt wird. Aber ich denke mal, das man den eigentlichen Beitrag als gelöst gesehen kann ;-)


Sid
 

Neue Beiträge

Forum-Statistiken

Themen
272.360
Beiträge
1.558.632
Mitglieder
187.834
Neuestes Mitglied
jordanx0206