views:

41

answers:

1

What I'd like to do is pretty simple in theory: a Google map is on the left, and a list/table is on the right. Each item in the list/table is plotted on the Google map. As you zoom in and out on the map, the list/table is 'filtered' to only show the rows that are visible on the Google map. Is this something that is possible?

Edit:

My list in an IEnumerable, and the HTML that's generated by ASP.NET MVC is:

<table>
    <tr id="0"><td>Item 1</td></tr>
    <tr id="1"><td>Item 2</td></tr>
    <tr id="2"><td>Item 3</td></tr>
</table>

To add the markers to Google Maps, I'm putting the latitude and longitude of every item as a new GLatLng in an array (in Javascript):

var gpsArray = [
    <% foreach (var item in Model) {
        if (item.Latitude != 0 && item.Longitude != 0) { %>
            new GLatLng(<%= item.Latitude %>, <%= item.Longitude %>),
    <% } } %>
];

The id of the table row corresponds to the array position in gpsArray.

A: 

I don't have extensive knowledge of the Google maps Api but as far as I know you can attach event listeners to events that are fired on the interaction with the map (see http://code.google.com/apis/maps/documentation/events.html).

Depending on the kind of event the display coordinates can be calculated and the tags/elements in the list can be filtered.

The question could be more detailed, where is the list populated, etc.

Have fun ;)

dr_hoppa
I updated my original question with more details.
Daniel T.