Adaptive googlemaps

Conditionally loads dynamic goolemaps or opens the map in a native mobile app / new tab after click on the static image.

<googlemaps options="map1"></googlemaps>

Options attributes

$scope.map1 = {

Required:

• sensor: false // true, false
• size: '500x300' // width x height
• zoom: 6
• center: 'California'

Optional:

• markers: ['San Francisco', 'San Jose']
• maptype: 'roadmap' // roadmap, satellite, terrain, hybrid
• mapevents: {redirect: true, loadmap: false}
• listen: true // watch for attributes change

};

Demo

mapevents: {{{redirect: false, loadmap: true} | json}}

Loads dynamic google map.

mapevents: {{{redirect: true, loadmap: false} | json}}

Opens google map in a new tab / a native mobile application.

Note: markers are not shown in Google Maps redirect.

mapevents: no mapevents

Nothing happens.

ToDo:

• Let the device/browser decide what kinds of map events will be used.
  Example: mobile device will open native maps application, browser with fast internet connection will auto load dynamic map...

Credits:

Jan Antala