4e3f984796
It looks like this approach will work well for panning (as anticipated). For animated zooming, it is not going to work as is. It looks like the canvas tile generation is too much for this type of animation loop. Though there are clearly still areas for optimization: * Don't create new tiles while animating between zoom levels. Using existing tiles only while animating should bring a significant performance gain. * Simple spatial index for tiles - each tile coord in the matrix could have a feature lookup object (keyed by id). This needs to account for rendered dimension (as witnessed by the point being cut by a tile). Given that the current example uses only three features, adding the spatial index should only be a minor improvement. * Reuse a fixed set of canvas tiles that are generated at construction (and increased/decreased with view size changes). * If a fixed set of tiles is not used, at least new ones could be cloned from existing ones (minor). * Do some profiling to look for more ideas. In addition, world-wrapping needs addressed. I don't think this renderer is the right (or at least the only) place to address this. And the cache of tiles needs to be managed for real. But hey, at least we've got a working tiled vector renderer now.
OpenLayers 3
Build it
Run make:
$ ./build.py
Run the examples in debug mode
Run the Plovr web server with:
$ ./build.py serve
Then, either open one of the example html files from the examples directory directly in your browser, or start a simple webserver, for example:
$ python -mSimpleHTTPServer
and explore the examples/ directory, for example by opening
http://localhost:8000/examples/side-by-side.html.
You can turn off compilation by appending ?mode=RAW to the URL, for example
http://localhost:8000/examples/side-by-side.html?mode=RAW.
Run tests
Run the plovr web server (see above), and either open the test/ol.html file
in the browser (e.g. http://localhost:8000/test/ol.html), or run ./build.py test
on the console (headless testing with PhantomJS).
See also the test-specific readme.
Run the linter
First, install the Closure Linter. Then:
$ ./build.py lint
Add examples
The examples are located in the examples directory. Adding a new example
implies creating two files in this directory, a .html file and .js file.
See examples/full-screen.html and examples/full-screen.js for instance.
The .html file needs to include a script tag with
loader.js?id=<example_name> as its src. For example, if the two files for
the examples are myexample.js and myexample.html then id should be set to
myexample in the loader.js URL.
build.py serve should be stopped and restarted for the
loader.js?id=<example_name> script tag to refer to a valid URL. build.py serve
triggers the examples target which creates Plovr JSON file for each example.