Hi everyone, I was hoping to get some input as to how I go about building/patching the following:
I’m trying to build a multiscreen (9x HD) map viewer, using tilemaps rendered with Tilemill (http://mapbox.com/tilemill/) Which allow you to generate your own custom maps based on Openstreetmap (http://openstreetmap) data. For now i’m not that interested in the multiscreen part, that is, I hope the multiscreen part comes down to just boygrouping a number of clients, running a map display patch.
At the moment i’m stuck trying to figure out how to implement the actual map display. Here’s what i’ve got so far:
Using Tilemill I am able to generate an ‘image-pyramid’, which is a (the) set of tiles that online map systems like Google Maps / OSM / Bing maps use. The way this works is that they basically fit the entire world into a square 256x256 and each zoom level squares the amount of tiles, like this:
level 0:
[ ]( ) (at level 0 the entire world fits in one 256x256 bitmap)
level 1:
[ ]( )[ ]( ) (entire world in a 512x512 image consisting of 4 tiles)
[ ]( )[ ]( )
level 2:
[ ]( )[ ]( )[ ]( )[ ]( ) (entire world in a 1024x1024 image consisting of 16 tiles)
[ ]( )[ ]( )[ ]( )[ ]( )
[ ]( )[ ]( )[ ]( )[ ]( )
[ ]( )[ ]( )[ ]( )[ ]( )
level 3: This would be a 2048x2048 image of 64 tiles
So at the moment I have a patch that can show these 4 zoomlevels, but I need help with building some sort of visibility determination (figuring out which tiles should be visible and be loaded into memory / vram) I’ve looked at some javascript implementations such as http://polymaps.org/ex/tiles.html which shows how the polymaps library determines the visibile tiles based on a polygon-fill algorithm. Now I have some experience in JS/Processing/AS3, but no formal training in CS, so i suck at figuring out algorithms by reading some else’s code, so if there’s anyone around that can explain how the algorithm works, and could give me some pointers as to how to patch this in VVVV it would be much appreciated.
Here’s what I managed to put together:
(I’m assuming a 1024x768 screensize)
- I need some sort of Origin Point (0,0) for the map
- I need a rectangle that represents the visible area, with the dimensions of the screen size (0,0) - (1024,768)
- Some way to check where the top left corner of the screen is in relation to the origin of the map.
- I need some sort of way to figure out which tiles are visible in the visible area.
Now the difficult part is in the final bullet, how can I build a test that would tell me which tiles would be visible?