As the browser world gravitates towards mobile and its small but high-res screens, we've seen Drupal being at the forefront with the rest of the world with various new solutions like responsive and adaptive designs. Can we equally expect a more mobile-friendly user experience for maps without having to resort to hybrid technologies like Drupal 7 map app example for iPhone & iPad? What's the state of the nation in maps?
What modules and libraries do we have at our disposal in Drupal these days to achieve things like:
o location retrieval through GPS etc., aka "HTML5 location" -- bye-bye IP address-based lookups!
o CPU and bandwidth friendly techniques
o attractive styling, possibly with animation through CSS3
A survey of the various mapping-related modules in Drupal reveals that the architectures tend to have three layers:
1) a layer to allow locations to be entered and stored, usually by latitude, longitude coordinates
2) some means of collating location records (nodes, users), often taking advantage of the Views module to filter by taxonomy, distance/proximity or other criteria
3) a map rendering engine, such as Google Maps, OpenLayers or Leaflet
This Comparison of mapping modules puts in one handy table the various combinations of location storage, location collation and map renderers available in Drupal.
Today, it seems that few solutions take full advantage of what is now possible and widely supported in HTML5. Apart from IP Geolocation Views and Maps no module allows you to superimpose the visitor's current position marker amongst the other location markers and many modules cannot centre the map on a moving target. The latter is an essential part of location-based services as found in apps like http://foursquare.com or http://yelp.com that show what's around us at any time, wherever we may be.
As for CSS3... Leaflet has on its home page a "pretty CSS3 popup" with rounded corners, but as an example that's hardly pushing today's limits is it?
Google: [common,map,util,marker].js (122k), [controls,stats].js (58 k)
OpenLayers: OpenLayers.js 2.11 (957k)
Leaflet: leaflet.js (103k)
Modest Maps: modest.maps.min.js (35k)
"Being designed from the ground up with mobile in mind" Leaflet does seem to have the edge with a slightly smaller foot print and, as we experienced through informal tests, a slightly shorter render time compared to Google or OpenLayers for similar maps on the same device. Also snappy is Modest Maps, a very lean package that does away with pretty much all mapping frills, including out-of-the-box markers, although the base version does allow you to pan and double-click to zoom. At the time of writing there did not seem to be a Drupal interface module for Modest Maps.
All in all, while Drupal now offers more modules to do more with maps than a year ago, there's little new under the sun when it comes to maps on mobile devices specifically.