| DOM | WebGL |
|---|---|
| Pan: | drag, arrow keys |
| Zoom: | double-click, shift+double-click, mouse wheel, +/- keys; shift+drag (DOM only) |
| Rotate: | shift+drag (WebGL only) |
| Brightness/contrast: | b/B/c/C keys (WebGL only) |
| Hue/saturation: | h/H/s/S keys (WebGL only) |
| Opacity: | o/O keys |
| Visibility: | v/V keys |
| Reset | 0 key |
Notes: the two maps share the same center, resolution, rotation and layers. Currently the DOM map does not support rotation.
Console tips: If you want to play around with the API in the console, first make sure that you're using the simple optimizations version of this demo, then open a console and experiment with the domMap, webglMap and layer variables in the console. The source code is in side-by-side.js.
Known bugs: When the map is rotated, panning on the WebGL map doesn't work as expected.