ピンポイントのGMAPS APIイベント処理

Question

私はgmaps用のAPIを持っていますが、特定のマーカーがクリックされたときにマーカーがいくつかあります。これはapiの外にあるhtmlを更新したい場合には問題ありません私はそれをしたい...

 var map; 
/*array for locations below */ 
var locations = [ 
    ['<h4>Kingsley Recruitment Liverpool <br/><br/> 11th Floor, The Plaza<br/> 100 Old Hall Street <br/> Liverpool <br/> L3 9QJ <br/> <br/> 0151 242 1630</h4>', 53.4109146,-2.9947334999999384], 

    ['<h4>Kingsley Recruitment Manchester <br/><br/> Centurion House<br/>129 Deansgate<br/>Manchester<br/>M3 3WR <br/> <br/> 0161 393 9889 </h4>', 53.479798 , -2.2479048], 

    ['<h4>Kingsley Recruitment London <br><br> Warnford Court <br> 29 Throgmorton Street<br> London <br> EC2N 2AT <br><br> 0203 817 7030</h4>', 51.5074, 0.1278], 
    ['<h4>Kingsley Recruitment Birmingham <br><br> Cornwall Buildings <br> 45 Newhall Street <br> Birmingham <br> B3 3QR <br><br> 0121 796 8460</h4>', 52.48208, -1.9027578], 


    ['<h4>Kingsley Recruitment Leeds <br><br> West One <br> Wellington Street<br>Leeds<br>LS1 1BA <br><br>0113 887 2170 </h4>', 53.8008 , -1.5491] 
]; 

// Setup the different icons and shadows 
var iconURLPrefix = 'https://www.google.com/intl/en_ALL/mapfiles/'; 

var icons = [ 
    iconURLPrefix + 'marker_black.png', 

] 

google.maps.event.addDomListener(window, "resize", function() { 
var center = map.getCenter(); 
google.maps.event.trigger(map, "resize"); 
map.setCenter(center); 
}); 

var iconsLength = icons.length; 

var map = new google.maps.Map(document.getElementById('MAPS'), { 
    zoom: 6, 
    center: new google.maps.LatLng(52.6369, -1.1398), 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    mapTypeControl: false, 
    streetViewControl: true, 
    scrollwheel:false, 
    panControl: false, 
    zoomControlOptions: { 
    position: google.maps.ControlPosition.BOTTOM_LEFT 
    } 
}); 





var infowindow = new google.maps.InfoWindow({ 
    maxWidth: 160 
}); 

var markers = new Array(); 

var iconCounter = 0; 

// Add the markers and infowindows to the map 
for (var i = 0; i < locations.length; i++) { 
    var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(locations[i][1], locations[i][2],locations[i][3],locations[i][4]), 
    map: map, 
    icon: icons[iconCounter] 
    }); 

    markers.push(marker); 

    google.maps.event.addListener(marker, 'click', (function(marker, i) { 
    return function() { 
     infowindow.setContent(locations[i][0]); 
     infowindow.open(map, marker); 
    } 
    })(marker, i)); 

    iconCounter++; 

    if(iconCounter >= iconsLength) { 
    iconCounter = 0; 
    } 
} 

function autoCenter() { 
    // Create a new viewpoint bound 
    var bounds = new google.maps.LatLngBounds(); 
    // Go through each... 
    for (var i = 0; i < markers.length; i++) { 
    bounds.extend(markers[i].position); 
    } 
    // Fit these bounds to the map 
    map.fitBounds(bounds); 
} 
autoCenter(); 

それは普通のことだったが、方法は、スクリプトは、それがオブジェクト指向であり、私はマーカーを検査し、xがなどへのyの更新innerHTMLプロパティをクリックしたときに言うことができる方法はありませんliの内部HTMLを更新するには

<div class = "contact-icons"> 
     <ul> 
     <div class = "indiv-icons"> 
     <img src = "images/call-icon.PNG"/> <li>CALL US <br/> +333 333 333 </li> 
     </div> 
     <div class = "indiv-icons"> 
     <img src = "images/address-icon.PNG"/> <li>ADDRESS<br/> 1234 Quigley Street</li> 
     </div> 
     <div class = "indiv-icons"> 
     <img src = "images/message-icon.PNG"/> <li>EMAIL<br/> support@yourcompany.com</li> 
     </div> 
     </ul> 
    </div> 
    </div> 

これは私にとっては複雑なタスクのようですhttp://79.170.40.182/kingsley-test.co.uk/kingsley%209.9.2016/kingsley-new/contact.php

Answer 1

マーカーをクリックしたときにどのような機能を呼びたいのですか？イベントをマーカーに追加したいマーカーは1つだけですか？

それはすべてのマーカーである場合は、ちょうどそれが

google.maps.event.addListener(marker, 'click', (function(marker, i) { 
    return function() { 

を言うところの後

nameOfYourFunction(marker) 

を追加