drawing-manager.js.html 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>JSDoc: Source: directives/drawing-manager.js</title>
  6. <script src="scripts/prettify/prettify.js"> </script>
  7. <script src="scripts/prettify/lang-css.js"> </script>
  8. <!--[if lt IE 9]>
  9. <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  10. <![endif]-->
  11. <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
  12. <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
  13. </head>
  14. <body>
  15. <div id="main">
  16. <h1 class="page-title">Source: directives/drawing-manager.js</h1>
  17. <section>
  18. <article>
  19. <pre class="prettyprint source linenums"><code>/**
  20. * @ngdoc directive
  21. * @name drawing-manager
  22. * @requires Attr2Options
  23. * @description
  24. * Requires: map directive
  25. * Restrict To: Element
  26. *
  27. * @example
  28. * Example:
  29. *
  30. * &lt;map zoom="13" center="37.774546, -122.433523" map-type-id="SATELLITE">
  31. * &lt;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;" >&lt;/drawing-manager>
  32. * &lt;/map>
  33. *
  34. * TODO: Add remove button.
  35. * currently, for out solution, we have the shapes/markers in our own controller, and we use some css classes to change the shape button
  36. * to a remove button (&lt;div>X&lt;/div>) and have the remove operation in our own controller.
  37. */
  38. /*jshint -W089*/
  39. ngMap.directive('drawingManager', ['Attr2Options', function(Attr2Options) {
  40. var parser = Attr2Options;
  41. return {
  42. restrict: 'E',
  43. require: '^map',
  44. link: function(scope, element, attrs, mapController) {
  45. var orgAttrs = parser.orgAttributes(element);
  46. var filtered = parser.filter(attrs);
  47. var options = parser.getOptions(filtered);
  48. var controlOptions = parser.getControlOptions(filtered);
  49. var events = parser.getEvents(scope, filtered);
  50. console.log("filtered", filtered, "options", options, 'controlOptions', controlOptions, 'events', events);
  51. /**
  52. * set options
  53. */
  54. var drawingManager = new google.maps.drawing.DrawingManager({
  55. drawingMode: options.drawingmode,
  56. drawingControl: options.drawingcontrol,
  57. drawingControlOptions: controlOptions.drawingControlOptions,
  58. circleOptions:options.circleoptions,
  59. markerOptions:options.markeroptions,
  60. polygonOptions:options.polygonoptions,
  61. polylineOptions:options.polylineoptions,
  62. rectangleOptions:options.rectangleoptions
  63. });
  64. /**
  65. * set events
  66. */
  67. var events = parser.getEvents(scope, filtered);
  68. for (var eventName in events) {
  69. google.maps.event.addListener(drawingManager, eventName, events[eventName]);
  70. }
  71. mapController.addObject('mapDrawingManager', drawingManager);
  72. }
  73. }; // return
  74. }]);
  75. </code></pre>
  76. </article>
  77. </section>
  78. </div>
  79. <nav>
  80. <h2><a href="index.html">Index</a></h2><h3>service</h3><ul><li><a href="Attr2Options.html">Attr2Options</a></li><li><a href="GeoCoder.html">GeoCoder</a></li><li><a href="NavigatorGeolocation.html">NavigatorGeolocation</a></li><li><a href="StreetView.html">StreetView</a></li></ul><h3>directive</h3><ul><li><a href="bicycling-layer.html">bicycling-layer</a></li><li><a href="cloud-layer.html">cloud-layer</a></li><li><a href="custom-control.html">custom-control</a></li><li><a href="drawing-manager.html">drawing-manager</a></li><li><a href="dynamic-maps-engine-layer.html">dynamic-maps-engine-layer</a></li><li><a href="fusion-tables-layer.html">fusion-tables-layer</a></li><li><a href="heatmap-layer.html">heatmap-layer</a></li><li><a href="info-window.html">info-window</a></li><li><a href="kml-layer.html">kml-layer</a></li><li><a href="lazy-load.html">lazy-load</a></li><li><a href="map.html">map</a></li><li><a href="map-data.html">map-data</a></li><li><a href="map-type.html">map-type</a></li><li><a href="MapController.html">MapController</a></li><li><a href="maps-engine-layer.html">maps-engine-layer</a></li><li><a href="marker.html">marker</a></li><li><a href="overlay-map-type.html">overlay-map-type</a></li><li><a href="shape.html">shape</a></li><li><a href="traffic-layer.html">traffic-layer</a></li><li><a href="transit-layer.html">transit-layer</a></li><li><a href="weather-layer.html">weather-layer</a></li></ul>
  81. </nav>
  82. <br clear="both">
  83. <footer>
  84. Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.3.0-alpha9</a>
  85. and <a href="https://github.com/allenhwkim/angular-jsdoc">angular-jsdoc</a>
  86. </footer>
  87. <script> prettyPrint(); </script>
  88. <script src="scripts/linenumber.js"> </script>
  89. <script>
  90. var href=window.location.href.match(/\/([^\/]+$)/)[1];
  91. document.querySelector("nav a[href='"+href+"']").scrollIntoView(true);
  92. if (window.location.hash == "")
  93. document.querySelector("body").scrollIntoView(true);
  94. </script>
  95. </body>
  96. </html>