Hi,
I've been playing around with latest version of OpenLayers from svn.
Great work on the mobile version :)
Found a little trick to vastly improve the pinch-zoom performance on
iPhone/iPad:
img.olTileImage {
-webkit-transform: translate3d(0, 0, 0);
}
For some strange reason translate3d is hardware accelerated in Mobile
Safari while the regular translate is not. I first tried to rewrite
the PinchZoom control to use translate3d with 0px in the z-axis, but
that made the pinch zoom to behave differently. Turns out that just
having translate3d(0,0,0) on the tiles combined with a scripted
translate in the PinchZoom control is enough to trigger hardware
rendering.
Not sure how this affects Android and other webkit-browsers. Briefly
tested in Chrome 10, 11, 12, Safari and on a HTC Desire. Have had
Safari on my iPad crash a few times lately, but not sure if it's
related to the translate3d or not.
Thomas Fuchs has written a bit more in-depth research on how to make
smooth animations for iOS:
http://mir.aculo.us/2010/06/04/making-an-ipad-html5-app-making-it-really-fast/
Is it ok if I include the style rule above in style.css, or shoud we
do some device/feature detection and add a custom css-class to apply
the 3d-hack?
Regards,
Gregers
_______________________________________________
Dev mailing list
d...@lists.osgeo.org
http://lists.osgeo.org/mailman/listinfo/openlayers-dev
