viernes, 16 de diciembre de 2011

Hardware accelerated map navigation with CSS3

Hardware accelerated map navigation with CSS3:





One of the enhancements to the ArcGIS API for JavaScript at version 2.6
is the use of
CSS3 transforms
while panning and zooming a map. When enabled, there
is a subtle animation and fade when images that make up tiled map layers
are added to or removed from the map. You can see this in one of the

simple SDK samples
. This is similar to how the other ArcGIS web APIs, for
Flex and Silverlight, operate.




There are both aesthetic and performance benefits from using the latest and
greatest in CSS. Aesthetically, the transition between map levels is more
pleasing due to a fade animation. For performance, some webkit and mobile
browsers use
hardware acceleration
when a webpage uses CSS transforms. This is
especially beneficial on older versions of iOS.




Like other new HTML5 and CSS3 capabilities, transforms are not yet consistently
implemented across browsers. For a complete rundown of browser support, check out
caniuse.com's browser
support chart for CSS3 transforms
. While that's a good reference, there are
some subtleties to the current implementations. In Chrome on XP, there's
an existing bug
that will hopefully be addressed by Chrome 17 in early 2012. For Firefox, version 10 (also due in early 2012) should bring full support for transforms.




Version 2.6 of the ArcGIS API for JavaScript uses CSS3 transforms by
default where they're supported. The API will automatically use CSS3
transforms for the following browsers:


  • Firefox 4+
  • Chrome 4+
  • Safari 3.1+
  • IE10
  • iOS (mobile Safari) 3.2+
  • Android 3+

The API uses "classic" mode (no transforms) for Internet Explorer 6, 7, 8 and 9.



In the rare case where a developer would like to opt out of using
transforms, we provide map configuration options to disable transforms.
Please refer to the
options section of the map class documentation
, specifically the
navigationMode property.



Contributed by Derek Swingley of the ArcGIS API for JavaScript development team


No hay comentarios:

Comparte en Facebook

Mi gran Blogg: