Google Maps Cluster And Dropdown Of Locations Outside Map

I have created a google map using Marker Clustering - the location array looks like this var locations = [ { title: 'Marker 1', lat: 0, lng: 0, info: 'Info Window 1' }, { title: '

Solution 1:

By a wild guess:

functionaddMarker(i) {
    var draftMarker = markers[i];
    var myLatLng = new google.maps.LatLng(draftMarker.lat, draftMarker.lng);
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        title: draftMarker.title,
        icon: '<?php echo get_template_directory_uri(); ?>/images/location-marker.png'
    });

    google.maps.event.addListener(marker, 'click', function () {
        info.setContent(draftMarker.info);
        info.open(map, marker);
    });
    gmarkers.push(marker);
    side_bar_html += '<option value=' + (gmarkers.length-1) + '>' + draftMarker.title + '<\/option>';

    return marker;

---

By your last edit => change click event inside addMarker function with this

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