source : marker.js 

  1. /**
  2.  * @ngdoc directive
  3.  * @name marker
  4.  * @param Attr2Options {service} convert html attribute to Google map api options
  5.  * @param NavigatorGeolocation It is used to find the current location
  6.  * @description
  7.  *  Draw a Google map marker on a map with given options and register events
  8.  *
  9.  *  Requires:  map directive
  10.  *
  11.  *  Restrict To:  Element
  12.  *
  13.  * @attr {String} position address, 'current', or [latitude, longitude]
  14.  *  example:
  15.  *    '1600 Pennsylvania Ave, 20500  Washingtion DC',
  16.  *    'current position',
  17.  *    '[40.74, -74.18]'
  18.  * @attr {Boolean} centered if set, map will be centered with this marker
  19.  * @attr {Expression} geo-callback if position is an address,
  20.  *   the expression is will be performed when geo-lookup is successful.
  21.  *   e.g., geo-callback="showStoreInfo()"
  22.  * @attr {Boolean} no-watcher if true, no attribute observer is added.
  23.  *   Useful for many ng-repeat
  24.  * @attr {String} <MarkerOption>
  25.  *   [Any Marker options](https://developers.google.com/maps/documentation/javascript/reference?csw=1#MarkerOptions)
  26.  * @attr {String} <MapEvent>
  27.  *   [Any Marker events](https://developers.google.com/maps/documentation/javascript/reference)
  28.  * @example
  29.  * Usage:
  30.  *   <map MAP_ATTRIBUTES>
  31.  *    <marker ANY_MARKER_OPTIONS ANY_MARKER_EVENTS"></MARKER>
  32.  *   </map>
  33.  *
  34.  * Example:
  35.  *   <map center="[40.74, -74.18]">
  36.  *    <marker position="[40.74, -74.18]" on-click="myfunc()"></div>
  37.  *   </map>
  38.  *
  39.  *   <map center="the cn tower">
  40.  *    <marker position="the cn tower" on-click="myfunc()"></div>
  41.  *   </map>
  42.  */
  43. /* global google */
  44. (function() {
  45.   'use strict';
  46.   var parser, $parse, NgMap;
  47.   var getMarker = function(options, events) {
  48.     var marker;
  49.     if (NgMap.defaultOptions.marker) {
  50.       for (var key in NgMap.defaultOptions.marker) {
  51.         if (typeof options[key] == 'undefined') {
  52.           console.log('setting default marker options', 
  53.             key, NgMap.defaultOptions.marker);
  54.           options[key] = NgMap.defaultOptions.marker[key];
  55.         }
  56.       }
  57.     }
  58.     if (!(options.position instanceof google.maps.LatLng)) {
  59.       options.position = new google.maps.LatLng(0,0);
  60.     }
  61.     marker = new google.maps.Marker(options);
  62.     /**
  63.      * set events
  64.      */
  65.     if (Object.keys(events).length > 0) {
  66.       console.log("markerEvents", events);
  67.     }
  68.     for (var eventName in events) {
  69.       if (eventName) {
  70.         google.maps.event.addListener(marker, eventName, events[eventName]);
  71.       }
  72.     }
  73.     return marker;
  74.   };
  75.   var linkFunc = function(scope, element, attrs, mapController) {
  76.     mapController = mapController[0]||mapController[1];
  77.     var orgAttrs = parser.orgAttributes(element);
  78.     var filtered = parser.filter(attrs);
  79.     var markerOptions = parser.getOptions(filtered, scope, {scope: scope});
  80.     var markerEvents = parser.getEvents(scope, filtered);
  81.     console.log('marker options', markerOptions, 'events', markerEvents);
  82.     var address;
  83.     if (!(markerOptions.position instanceof google.maps.LatLng)) {
  84.       address = markerOptions.position;
  85.     }
  86.     var marker = getMarker(markerOptions, markerEvents);
  87.     mapController.addObject('markers', marker);
  88.     if (address) {
  89.       NgMap.getGeoLocation(address).then(function(latlng) {
  90.         marker.setPosition(latlng);
  91.         markerOptions.centered && marker.map.setCenter(latlng);
  92.         var geoCallback = attrs.geoCallback;
  93.         geoCallback && $parse(geoCallback)(scope);
  94.       });
  95.     }
  96.     //set observers
  97.     mapController.observeAttrSetObj(orgAttrs, attrs, marker); /* observers */
  98.     element.bind('$destroy', function() {
  99.       mapController.deleteObject('markers', marker);
  100.     });
  101.   };
  102.   var marker = function(Attr2MapOptions, _$parse_, _NgMap_) {
  103.     parser = Attr2MapOptions;
  104.     $parse = _$parse_;
  105.     NgMap = _NgMap_;
  106.     return {
  107.       restrict: 'E',
  108.       require: ['^?map','?^ngMap'],
  109.       link: linkFunc
  110.     };
  111.   };
  112.   marker.$inject = ['Attr2MapOptions', '$parse', 'NgMap'];
  113.   angular.module('ngMap').directive('marker', marker);
  114. })();