Home/ Questions/Q 8635301
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T09:56:28+00:00

I’m doing this as an exercise to gain some insight on how such things

  • 0

I’m doing this as an exercise to gain some insight on how such things work in real life.

I have some options on the UI, based on which the results are filtered and they need to be displayed on google maps. Something along the lines of padmapper.com.

Drill down to San Francisco and one can change the budget on UI. As the budget is modified, search results are modified on google maps.

How can I achieve this where I have a simple slider (e.g. budget) and the underlying results are updated as the slider is moved ?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Without code, it’s hard to give you an example in code, so I’ll try in english:

    Basically whatever slider you’re using has some sort of change event that’s fired after you change the slider values. On this event, capture the values, loop through your Markers on the map, and if some property of your marker falls within the slider’s values, show it, otherwise hide it.

    This assumes that when you created the Marker you did 2 things: 1) give it some sort of custom property to store the value you want to filter on, and 2) you stored a reference to each Marker in an array.

    Would love to help you more, but you’ll need to post some code.

    Updated to address comment:

    To handle the “too much data issue”, you can call the server to load just the points that fall within the map’s view (called a bounding box) as Markers on the client. On your filter’s change event, you loop through these Markers that are already on the client and show or hide them based on the filter, no call to the server necessary, unless the user navigates the map again, then on idle you can make another call to the server and retrieve points again in the bounding box, but that also match your filter criteria. So it’s a combination of only retrieving the data you need from the server, and filtering them on the client. You can also have a limit to how many points come back from the server, so you don’t lose performance when zoomed out.

    For more info on handling lots of data, see this article from Google and this specific implementation.

    • 0