source : custom-control.js 

  1. /**
  2.  * @ngdoc directive
  3.  * @name custom-control
  4.  * @param Attr2Options {service} convert html attribute to Google map api options
  5.  * @param $compile {service} AngularJS $compile service
  6.  * @description
  7.  *   Build custom control and set to the map with position
  8.  *
  9.  *   Requires:  map directive
  10.  *
  11.  *   Restrict To:  Element
  12.  *
  13.  * @attr {String} position position of this control
  14.  *        i.e. TOP_RIGHT
  15.  * @attr {Number} index index of the control
  16.  * @example
  17.  *
  18.  * Example:
  19.  *  <map center="41.850033,-87.6500523" zoom="3">
  20.  *    <custom-control id="home" position="TOP_LEFT" index="1">
  21.  *      <div style="background-color: white;">
  22.  *        <b>Home</b>
  23.  *      </div>
  24.  *    </custom-control>
  25.  *  </map>
  26.  *
  27.  */
  28. (function() {
  29.   'use strict';
  30.   var parser, NgMap;
  31.   var linkFunc = function(scope, element, attrs, mapController, $transclude) {
  32.     mapController = mapController[0]||mapController[1];
  33.     var filtered = parser.filter(attrs);
  34.     var options = parser.getOptions(filtered, {scope: scope});
  35.     var events = parser.getEvents(scope, filtered);
  36.     var innerScope = scope.$new();
  37.     /**
  38.      * build a custom control element
  39.      */
  40.     var customControlEl = element[0].parentElement.removeChild(element[0]);
  41.     var content = $transclude( innerScope, function( clone ) {
  42.       element.empty();
  43.       element.append( clone );
  44.       element.on( '$destroy', function() {
  45.         innerScope.$destroy();
  46.       });
  47.     });
  48.     /**
  49.      * set events
  50.      */
  51.     for (var eventName in events) {
  52.       google.maps.event.addDomListener(customControlEl, eventName, events[eventName]);
  53.     }
  54.     mapController.addObject('customControls', customControlEl);
  55.     var position = options.position;
  56.     mapController.map.controls[google.maps.ControlPosition[position]].push(customControlEl);
  57.     element.bind('$destroy', function() {
  58.       mapController.deleteObject('customControls', customControlEl);
  59.     });
  60.   };
  61.   var customControl =  function(Attr2MapOptions, _NgMap_)  {
  62.     parser = Attr2MapOptions, NgMap = _NgMap_;
  63.     return {
  64.       restrict: 'E',
  65.       require: ['?^map','?^ngMap'],
  66.       link: linkFunc,
  67.       transclude: true
  68.     }; // return
  69.   };
  70.   customControl.$inject = ['Attr2MapOptions', 'NgMap'];
  71.   angular.module('ngMap').directive('customControl', customControl);
  72. })();