Ideas
Here you are going to find my ideas to improve the project (without any logical order). If you can understand this bad english and disorganization you can apply to Mensa (to improve this project I'm reading some eHows).
Sorry about people using Internet Explorer (if you choose that browser is not your fault, maybe you can blame brain damage induced by cell phones) and also because I don't know if SVG graphics will display fine. Also this project need HTML5 with canvas (guys at Microsoft don't believe on that).
Cheap Example
Here it's a cheap and quick example of features draw as heatmap in a box with a tile inside. Only is to show that it's obvious to consider the features outside the bounds (and bounds of the tile if we are going to work with tiles). If you are going to have features drawed with a radius X you need to keep in mind that you have to retrieve and draw the features within the bounds + radius. If the radius increase too much you need to waste a lot more of cpu and bandwidth.
Another Example
This is other example showing almost the same.
Tile Cache
Currently OLHeatmap works this way:
- Create a OpenLayers map with OSM layer
- Add a vectorial (canvas) layer on the map
- Retrieve features from Xapi within the neccesary bounds (map bounds + offset)
- Draw those features as markers using circle images
- Walk over the canvas layer pixel-by-pixel reading the alpha channel value of the markers and selecting a colour depending on the value
It's neccesary to use a tile based approach !
Two alternatives (that I've in mind):
- a) Request the features in the yellow square and draw circles in the position of each (put a png marker? draw with JavaScript? use SVG?). Then read the alpha channel of the pixels over the blue square and using that alpha value calculate the colour of the pixel to be used in the tile.
- b) Request the features in the yellow square. Walk through the pixels of the blue square calculating the distance to the features. Depending the distances select the colour of the pixel.
For each of those alternatives it's neccesary to do some benchmarks and see what technique is faster.
Also keep in mind:
- It's neccesary to have a cache technique.
- If there is a change clean the cache (change the features used, radius, etc).
- To avoid that the cache grows without control it's neccesary to purge it.
- Use techniques like last-used first-out, more time out of bounds or the farthest to remove the tiles of the cache.
- Store the tiles as images and add a simple layer that calls a function instead of loading the tiles from a tile server.
- Can add an extra dimension to the cache to make animations over time
News :
2010-07-20: First version release