0

I have an app that displays recent jobs on a map as pinpoints using Leafletjs.

With Leafletjs, when you want to zoom to the user's detected location, you call something like:

map.locate({'setView' : true, 'timeout' : 10000, maxZoom: 10});

However, for some locations, the zoom level 10 does not contain any job points, so I'd like to dynamically set the zoom so that at least on job is visible to the users.

I know that I can listen for the locate function's success and then check with something like:

map.on('locationfound', function() { 
  //for marker in markers{
  //is point within currently visible bounds
  //break on first positive
  //else, 
  //zoom up a level, repeat previous checks
  } 
}

but that's quite inefficient, especially if I have a large number of points.

Does Leaflet have any built in functions/methods to provide information about layers within the current map view?

bibliotechy
  • 89
  • 7

1 Answers1

0

If you do some things on the server side, you can probably do the calculations fast enough.

  1. Store the locations in pixel coordinates in your database at some way-zoomed-in zoom level (I use zoom level 23). I call this coordinate system "Vast Coordinate System". Then, to get the tile coordinates for a point at a specific location is IIRC one bitwise shift -- very fast, and something you can do in SQL.
  2. Convert your users' location to pixel coords at that way-zoomed in level.
  3. Iterate on zoom level. Get the tile coord for the user's location at that zoom level, then do an SQL query which counts the number of points on that tile. If > 0, stop.

Your SQL will be something like (sorry, I'm being lazy and doing it from memory/thinking instead of actually trying it out)

SELECT count(*) WHERE (vcsX>>(zoom+8)==userX>>(zoom+8)) AND (vcsY>>(zoom+8)==userY>>(zoom+8));

where vcsX and vcsY are the pixel coordinates in Vast Coordinate System.

Kaitlin Duck Sherwood
  • 627
  • 1
  • 5
  • 12