How to avoid calling server for duplicate data using using Google Maps API

Question

Within my application, users can scroll around a Google Map to see various markers and other data that have been placed on the map using the Google Maps API. Whenever the user emits the dragend event, I send a request to my server passing it the current lat/lng of the center of the map, as well as a radius value. My server takes these lat, lng, and radius values and queries the database to see if there are any relevant objects that should be displayed on the map. If there are, they are returned to the browser, and rendered on the map.

I'm trying to avoid making a call to my server every single time the user drags the map. Basically, if the call that would be made would not include any new points, the call should not be made.

I tried to show visually what I mean in the image below:

The filled in blue circles represent areas that have already been queried due to the user positioning the map in the center of each circle. When they do this, a call is made to the server, and data for the area covered by the filled in blue circle is returned.

As they drag around the map, the union of all of these blue areas represents locations for which data has already been retrieved from the server. Now, the small red circle represents a position where if the user were to position the map, I would not want to call the server to load new data. That's because the entire area made up by that center point and radius has already been retrieved; it's already part of the blue area.

On the other hand, the green position represents a location for which I would want to call the server to get data, since some of the area made up by the center point and radius fall outside of the blue area.

I'm wondering if anyone has any approaches for solving this problem. It's got me stumped.

Answer 1

The solution is simple.

1) User drags the thing or whatever.. On the backend, store that location in a session or a database. Load the response as usual.

2) User does whatever again. This time, on the back end check the saved session location from before, calculate the distance between the new position and the one you saved during the last call. You can use Google's API for this. If the distance is smaller than the radius used, you know there will be some overlap and you can filter out those results before returning the data to the front end.

This will reduce the results PHP gives to only the new ones. If you want to avoid making an ajax call alltogether the only way to do that is to load the entire database into javascript. How else would you expect javascript to know if there are any rows.