javascript - Making Google maps marker array global breaks marker click event -
in page use following script:
function initialize() { var mapcanvas = document.getelementbyid('map'); var mapoptions = {center:new google.maps.latlng(latitudemid,longitudemid),zoom:15,maptypeid:google.maps.maptypeid.roadmap,streetviewcontrol:false,maptypecontrol:true,scalecontrol:true,scalecontroloptions:{position:google.maps.controlposition.top_right}}; var map = new google.maps.map(mapcanvas, mapoptions); var markers=[]; //<=========================================== inside function initialize() var i; var insertion; var previousmarker; (i = 0; < fotocount; i++) { var mylatlng=new google.maps.latlng(latituden[i], longituden[i]); var marker = new styledmarker({styleicon:new styledicon(styledicontypes.marker,{color:'00ff00',text:letters[i]}),position:mylatlng,map:map}); marker.set('zindex', -i); marker.myindex = i; markers.push(marker); google.maps.event.addlistener(marker, 'click', function() { var insertion=""; insertion='<img src=\"http://www.pdavis.nl/ams/'.concat(bestanden[this.myindex],'.jpg\"></img>'); insertion=insertion.concat('<table class=width100><tr><td>bestand: ',bestanden[this.myindex],'</td><td class=pright>lokatie: ',latituden[this.myindex],' °n., ',longituden[this.myindex],' °e. (',letters[this.myindex],')</td>'); insertion=insertion.concat('<td class=pright>genomen: ',datums[this.myindex],'</td></tr><td colspan=3>object: ',objecten[this.myindex],'</td></table>'); $('#photo').html(insertion); if(previousmarker!=null){previousmarker.styleicon.set('color', '00ff00')}; this.styleicon.set('color', 'ff0000'); thismarker=this.myindex; previousmarker=this; }); } google.maps.event.trigger(markers[0], 'click'); } google.maps.event.adddomlistener(window, 'load', initialize);
clicking on marker highlights selected marker (turns red) , shows relevant photo. 2 buttons vorige , volgende (previous , next, select previous or next photo) don't work because array markers[] local function initialize():
function next() { thismarker++; if (thismarker>=fotocount) {thismarker=0}; // following line not working google.maps.event.trigger(markers[thismarker], 'click'); } function previous() { thismarker--; if (thismarker==0) {thismarker=fotocount-1}; // following line not working google.maps.event.trigger(markers[thismarker], 'click'); }
the obvious fix move "var markers=[]" outside function initialize() (this page) make array global, button highlighting (button "a" red upon start; clicked button goes red) not work. doing wrong here?
the weird thing not when pass index 0 maximum click event explodes because sending negative value, change , wonder if -1, if true passes greater index - 1 (excepcion: cannot read property '__e3ae_' of undefined)
function previous() { thismarker--; if (thismarker==-1) {thismarker=fotocount-1}; // following line not working google.maps.event.trigger(markers[thismarker], 'click'); }
sorry english
Comments
Post a Comment