drawing-manager.js 2.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. /**
  2. * @ngdoc directive
  3. * @name drawing-manager
  4. * @requires Attr2Options
  5. * @description
  6. * Requires: map directive
  7. * Restrict To: Element
  8. *
  9. * @example
  10. * Example:
  11. *
  12. * <map zoom="13" center="37.774546, -122.433523" map-type-id="SATELLITE">
  13. * <drawing-manager on-overlaycomplete="onMapOverlayCompleted()" position="ControlPosition.TOP_CENTER" drawingModes="POLYGON,CIRCLE" drawingControl="true" circleOptions="fillColor: '#FFFF00';fillOpacity: 1;strokeWeight: 5;clickable: false;zIndex: 1;editable: true;" ></drawing-manager>
  14. * </map>
  15. *
  16. * TODO: Add remove button.
  17. * currently, for out solution, we have the shapes/markers in our own controller, and we use some css classes to change the shape button
  18. * to a remove button (<div>X</div>) and have the remove operation in our own controller.
  19. */
  20. /*jshint -W089*/
  21. ngMap.directive('drawingManager', ['Attr2Options', function(Attr2Options) {
  22. var parser = Attr2Options;
  23. return {
  24. restrict: 'E',
  25. require: '^map',
  26. link: function(scope, element, attrs, mapController) {
  27. var orgAttrs = parser.orgAttributes(element);
  28. var filtered = parser.filter(attrs);
  29. var options = parser.getOptions(filtered);
  30. var controlOptions = parser.getControlOptions(filtered);
  31. var events = parser.getEvents(scope, filtered);
  32. console.log("filtered", filtered, "options", options, 'controlOptions', controlOptions, 'events', events);
  33. /**
  34. * set options
  35. */
  36. var drawingManager = new google.maps.drawing.DrawingManager({
  37. drawingMode: options.drawingmode,
  38. drawingControl: options.drawingcontrol,
  39. drawingControlOptions: controlOptions.drawingControlOptions,
  40. circleOptions:options.circleoptions,
  41. markerOptions:options.markeroptions,
  42. polygonOptions:options.polygonoptions,
  43. polylineOptions:options.polylineoptions,
  44. rectangleOptions:options.rectangleoptions
  45. });
  46. /**
  47. * set events
  48. */
  49. var events = parser.getEvents(scope, filtered);
  50. for (var eventName in events) {
  51. google.maps.event.addListener(drawingManager, eventName, events[eventName]);
  52. }
  53. mapController.addObject('mapDrawingManager', drawingManager);
  54. }
  55. }; // return
  56. }]);