javascript - How to highlight map marker upon selection of an html element -


HTML elements need help with contact with Google Maps.

There are 2 sections on my web page. On the right side of the page, I have a map showing more than one marker. On the left side of the page I have a list with the addresses that correspond to the markers in the map.

Please indicate from the list how to highlight the marker, when the corresponding address is selected at the address on the left side of the page.

OK, I made it with hover (). The marker is highlighted by hovering over the div

    gt; & lt ; / Div> We index on hovered = $ ('# markers_info.marker'). Index (this); marker [indexing The] .setIcon (normalIcon ());});}); / ** Google Maps stuff * / var markerdata = [the order of these markers & lt; Div class = "marker" & gt; & Lt; / Div & gt; Elements {Lat: 50.84498605, LNG: 4.34, 99, 77,747, title: 'Manneken Pis'} {Latitude: 50.8,48,48, 9 13, LNG: 4.35,40,53,363, Title: 'Jeanneke Pis'} {Latitude: 50.8,46,73,465, LNG: 4.35,24,66,166, Title: 'Grand Palace'}]; Var map; Var marker = []; MapOptions = {zoom: 15, center: new google.maps.LatLng (50.84673465,4.352466166), // Brussels, Belgium mapTypeId: google.maps.MapTypeId.ROADMAP}; Function initialize () {map = new google.maps.Map (document.getElementById ('map-canvas'), map options); {Markers.push (new google.maps.marker ({status: new google.maps.LatLng (markerData [i] .lat, markerData for; & lt; markerData.length; i plus = 0 i ++) [I] .lng), title: markerdata [i]. Title, map: map, icon: normal icon ()})); }} // function which icons come back create your own marker or find function normalIcon () {return {url: 'http://1.bp.blogspot.com/_GZzKwf6g1o8/S6xwK6CSghI/AAAAAAAAA98/_iA3r4Ehclk/s1600/marker -green.png '}; } Highlight Icon () function {returns {url: 'http://steeplemedia.com/images/markers/markerGreen.png'}; } //google.maps.event.addDomListener (window, 'load', start); & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div id = "map-canvas" & gt; & Lt; / Div & gt; & Lt; Div id = "markers_info" & gt; & Lt; Div class = "marker" & gt; Manken Pis, 50.84498605,4.349 977747 & lt; / Div & gt; & Lt; Div class = "marker" & gt; Jeanneke Pis, 50.84848913,4.354053363 & lt; / Div & gt; & Lt; Div class = "marker" & gt; Grand Place, 50.84673465,4.352466166 & lt; / Div & gt; & Lt; / Div & gt; & Lt; / Body & gt;  

Comments