ol3.dom.MapRenderer: handle rotation

[fredj]

http://davidwalsh.name/css-transform-rotate

demo: http://mapbox.com/demo/running/

[fredj]

proof of concept : fredj/openlayers@openlayers:exp...dom-rotation

[twpayne]

Nice proof of concept @fredj !

The tricky bit is browser behaviour. As I understand it, some browsers render the entire div to an intermediate image, transform that, round to the nearest pixel, render that, and you get a nice result. Other browsers transform each individual element, round them to that to the nearest pixel, and the net result is rendering artefacts between individual elements, as the proof of concept shows on Mac OS X / Chrome. I might be wrong: those with experience, please correct me.

That all said, I suspect that all of these problems can be overcome by using a 2D canvas renderer, which has the advantage of being hardware-accelerated on some browsers. Maybe this is another possible solution?

[fredj]

I've tried to force the hardware acceleration by using the -webkit-transform: translate3d(0, 0, 0); hack but without success.

Adding a 2D canvas renderer is a great idea. Not only for this issue but also for the mobile rendering (see http://m.maps.nokia.com/)