Question

I recently started learning knockout js, which I believe would suit for one independent project that would be a webapp that features google map on it.

I stumbled upon your Ryan’s jsfiddle (http://jsfiddle.net/rniemeyer/FcSmA/) when searching for ways to connect google map markers and observable arrays in KO.

I’ve forked it into another, (http://jsfiddle.net/gizzat/ADexG/) where I “listen” to tr tags(line in table corresponds to one maker) and update marker info (changing color of marker when hovering on table row).

But I cant find a way in opposite direction: to affect html (table rows) when listening for marker events (im trying to highlight table row when hovering on some marker, explained on line 29).

Would be happy if you have any advice/solution.

Answer 1

The only I can think of doing it is by adding a listener to the mouseover event in google maps

google.maps.event.addListener(marker, "mouseover", function() {
            var rowId= this.rowId;
            $("#"+rowId).addClass("<ROWHIGHLIGHTCLASS>");
});

Further information about the marker object here

EDIT from Gizzat’s comment
When you create your marker you can can custom data to it, for example

var markerA = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(0, 0),
    rowId: "row1"
});