0

When you have a leaflet.js application, such as my experimental toy for xkcd GeoHashing (look at geohashing.cgi plus mirkarte.js), you have to draw points all over the world. In the GeoHashing case, their coordinates can easily be calculated (the links and information I put into the popups isn’t, though); for e.g. a map of geocaches, each individual marker needs to be processed somehow.

What is the usual approach to do this on a world-wide scale?

I thought to register an event handler on moveend… and zoomend… and who knows which else, that take into account the left-, right-, top- and bottom-most parts that have already been prepared (initially all empty), and, if the map extends beyond that, add markers for the new areas to the layer then cache the new boundaries, and limit marker display to beyond a certain zoomlevel. The problem with this is, possibly, response time, and that a rectangular approach will mean generating extra data (say I start at N 0° E 0°, then move northwards to N 50° E 0°, then eastwards towards N 50° E 1°, then I will have to calculate everything down to N 0° E 1° as well. Merely annoying in the GeoHashing case, but possibly network intensive if I have to request additional data (popups for geohashing, marker positions too for geocaching, etc).

Storing a list of map bounds that have already been used gets slow very fast if the user pans the map around a lot, e.g. manually/visually following a route. So, if I were to do this, some kind of merging would be needed, which I cannot yet imagine.

I have not studied other maps, because they are not usually Open Source or well-written/well-commented… I’ve seen a bit of use of Google Maps API v1 and v2, and Leaflet, e.g. in the Opencaching Network, but that’s not well-structured or -commented source code. I don’t have any real grounding in GIS (slowly pushing myself in from the side, as techie and cacher, but getting interested), so I lack a good example how this could best be done (just as other things I may post questions on if I get over my shyness to do so). I do intend my map (linked above) to eventually be such well-readable source code (not the current draft though, I also learned practical JavaScript while writing it, and realise it’s a throw-away prototype, albeit a working one).

So, what are the “standard” ways (there’s probably more than one, depending on the scenario even) to handle this without massive network, CPU and RAM cost due to choice of stupid algorithms?

Improve this question

1 Answer 1

Reset to default
2

I might be misunderstanding you, but if you're talking about querying a service for feature JSON dynamically based on the current extent of the map, in Esri Leaflet we create a tile grid so that we can repeatedly pass identical queries when possible to leverage browser based caching.

You can see the relevant section of the open source Leaflet plugin API here

Improve this answer
2
  • This sounds like a good way to do it. But you'd need to write a nice tiled vector plugin, and build an API as, as far as I know, nothing exists yet. But if you did write a tile vector API, then that would have the same URL for each tile and if it had been loaded before it would come out of the cache, which saves writing the cache logic. For something existing, aybe TileJSON would do the job, but I haven't tried it: github.com/kartena/leaflet-tilejson.
    – Alex Leith
    Commented Jan 15, 2015 at 0:27
  • Interesting idea about doing it by grid for caching. Thanks for the pointers too. I’ll have a look at it later and see whether this works. So, for the other part of my question… I can just throw stuff out of the layers if the map moves farther away, since re-fetching it is zero-cost if it comes from the browser cache. Hm. I would probably need to have the CGI send headers to make the browser cache the results consistently for a while. I’ll have to look that up, but it’s probably offtopic here anyway.
    – mirabilos
    Commented Jan 15, 2015 at 11:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.