git.roojs.org Git - roojs1/blob - docs/symbols/src/Roo_bootstrap_LocationPicker.js.html

   1 <html><head><title>../roojs1/Roo/bootstrap/LocationPicker.js</title><link rel="stylesheet" type="text/css" href="../../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
   2  * - LGPL
   3  *
   4  * Location Picker
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.LocationPicker
  10  * @extends Roo.bootstrap.Component
  11  * Bootstrap LocationPicker class
  12  * @cfg {Number} latitude Position when init default 0
  13  * @cfg {Number} longitude Position when init default 0
  14  * @cfg {Number} zoom default 15
  15  * @cfg {String} mapTypeId default google.maps.MapTypeId.ROADMAP
  16  * @cfg {Boolean} mapTypeControl default false
  17  * @cfg {Boolean} disableDoubleClickZoom default false
  18  * @cfg {Boolean} scrollwheel default true
  19  * @cfg {Boolean} streetViewControl default false
  20  * @cfg {Number} radius default 0
  21  * @cfg {String} locationName
  22  * @cfg {Boolean} draggable default true
  23  * @cfg {Boolean} enableAutocomplete default false
  24  * @cfg {Boolean} enableReverseGeocode default true
  25  * @cfg {String} markerTitle
  26  * @cfg {Array} styles
  27  *
  28  * @constructor
  29  * Create a new LocationPicker
  30  * @param {Object} config The config object
  31  */
  32
  33
  34 </span><span class="jsdoc-var">Roo.bootstrap.LocationPicker </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
  35
  36     </span><span class="jsdoc-var">Roo.bootstrap.LocationPicker.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  37
  38     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
  39         </span><span class="jsdoc-comment">/**
  40          * @event initial
  41          * Fires when the picker initialized.
  42          * @param {Roo.bootstrap.LocationPicker} this
  43          * @param {Google Location} location
  44          */
  45         </span><span class="jsdoc-var">initial </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  46         </span><span class="jsdoc-comment">/**
  47          * @event positionchanged
  48          * Fires when the picker position changed.
  49          * @param {Roo.bootstrap.LocationPicker} this
  50          * @param {Google Location} location
  51          */
  52         </span><span class="jsdoc-var">positionchanged </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  53         </span><span class="jsdoc-comment">/**
  54          * @event resize
  55          * Fires when the map resize.
  56          * @param {Roo.bootstrap.LocationPicker} this
  57          */
  58         </span><span class="jsdoc-var">resize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  59         </span><span class="jsdoc-comment">/**
  60          * @event show
  61          * Fires when the map show.
  62          * @param {Roo.bootstrap.LocationPicker} this
  63          */
  64         </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  65         </span><span class="jsdoc-comment">/**
  66          * @event hide
  67          * Fires when the map hide.
  68          * @param {Roo.bootstrap.LocationPicker} this
  69          */
  70         </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  71         </span><span class="jsdoc-comment">/**
  72          * @event mapClick
  73          * Fires when click the map.
  74          * @param {Roo.bootstrap.LocationPicker} this
  75          * @param {Map event} e
  76          */
  77         </span><span class="jsdoc-var">mapClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  78         </span><span class="jsdoc-comment">/**
  79          * @event mapRightClick
  80          * Fires when right click the map.
  81          * @param {Roo.bootstrap.LocationPicker} this
  82          * @param {Map event} e
  83          */
  84         </span><span class="jsdoc-var">mapRightClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  85         </span><span class="jsdoc-comment">/**
  86          * @event markerClick
  87          * Fires when click the marker.
  88          * @param {Roo.bootstrap.LocationPicker} this
  89          * @param {Map event} e
  90          */
  91         </span><span class="jsdoc-var">markerClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  92         </span><span class="jsdoc-comment">/**
  93          * @event markerRightClick
  94          * Fires when right click the marker.
  95          * @param {Roo.bootstrap.LocationPicker} this
  96          * @param {Map event} e
  97          */
  98         </span><span class="jsdoc-var">markerRightClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
  99     </span><span class="jsdoc-syntax">});
 100
 101 };
 102
 103 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.LocationPicker</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
 104
 105     </span><span class="jsdoc-var">gMapContext</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 106
 107     </span><span class="jsdoc-var">latitude</span><span class="jsdoc-syntax">: 0,
 108     </span><span class="jsdoc-var">longitude</span><span class="jsdoc-syntax">: 0,
 109     </span><span class="jsdoc-var">zoom</span><span class="jsdoc-syntax">: 15,
 110     </span><span class="jsdoc-var">mapTypeId</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 111     </span><span class="jsdoc-var">mapTypeControl</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 112     </span><span class="jsdoc-var">disableDoubleClickZoom</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 113     </span><span class="jsdoc-var">scrollwheel</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 114     </span><span class="jsdoc-var">streetViewControl</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 115     </span><span class="jsdoc-var">radius</span><span class="jsdoc-syntax">: 0,
 116     </span><span class="jsdoc-var">locationName</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 117     </span><span class="jsdoc-var">draggable</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 118     </span><span class="jsdoc-var">enableAutocomplete</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 119     </span><span class="jsdoc-var">enableReverseGeocode</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 120     </span><span class="jsdoc-var">markerTitle</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 121     </span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">: [],
 122
 123     </span><span class="jsdoc-var">getAutoCreate</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 124     {
 125
 126         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
 127             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 128             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-location-picker'
 129         </span><span class="jsdoc-syntax">};
 130
 131         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg
 132     </span><span class="jsdoc-syntax">},
 133
 134     </span><span class="jsdoc-var">initEvents</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">)
 135     {
 136         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.mapTypeId</span><span class="jsdoc-syntax">){
 137             </span><span class="jsdoc-var">this.mapTypeId </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">google.maps.MapTypeId.ROADMAP</span><span class="jsdoc-syntax">;
 138         }
 139
 140         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el.getWidth</span><span class="jsdoc-syntax">() || </span><span class="jsdoc-var">this.isApplied</span><span class="jsdoc-syntax">()){
 141             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 142         }
 143
 144         </span><span class="jsdoc-var">this.el.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">);
 145
 146         </span><span class="jsdoc-var">this.initial</span><span class="jsdoc-syntax">();
 147     },
 148
 149     </span><span class="jsdoc-var">initial</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 150     {
 151         </span><span class="jsdoc-var">this.gMapContext </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.GMapContext</span><span class="jsdoc-syntax">();
 152
 153         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 154
 155         </span><span class="jsdoc-var">google.maps.event.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.marker</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;dragend&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">) {
 156             </span><span class="jsdoc-var">_this.setPosition</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_this.gMapContext.marker.position</span><span class="jsdoc-syntax">);
 157         });
 158
 159         </span><span class="jsdoc-var">google.maps.event.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.map</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">){
 160             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">);
 161             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">);
 162             </span><span class="jsdoc-var">_this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'mapClick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">);
 163
 164         });
 165
 166         </span><span class="jsdoc-var">google.maps.event.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.map</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'rightclick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">){
 167             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'right click'</span><span class="jsdoc-syntax">);
 168             </span><span class="jsdoc-var">_this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'mapRightClick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">);
 169
 170         });
 171
 172         </span><span class="jsdoc-var">google.maps.event.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.marker</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">){
 173             </span><span class="jsdoc-var">_this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'markerClick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">);
 174
 175         });
 176
 177         </span><span class="jsdoc-var">google.maps.event.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.marker</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'rightclick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">){
 178             </span><span class="jsdoc-var">_this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'markerRightClick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">);
 179
 180         });
 181
 182         </span><span class="jsdoc-var">this.setPosition</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.location</span><span class="jsdoc-syntax">);
 183
 184         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'initial'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.gMapContext.location</span><span class="jsdoc-syntax">);
 185     },
 186
 187     </span><span class="jsdoc-var">isApplied</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 188     {
 189         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getGmapContext</span><span class="jsdoc-syntax">() == </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 190     },
 191
 192     </span><span class="jsdoc-var">getGmapContext</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 193     {
 194         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.gMapContext
 195     </span><span class="jsdoc-syntax">},
 196
 197     </span><span class="jsdoc-var">GMapContext</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 198     {
 199         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_map </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">google.maps.Map</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 200         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_marker </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">google.maps.Marker</span><span class="jsdoc-syntax">({
 201             </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">google.maps.LatLng</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.latitude</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.longitude</span><span class="jsdoc-syntax">),
 202             </span><span class="jsdoc-var">map</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">_map</span><span class="jsdoc-syntax">,
 203             </span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.markerTitle</span><span class="jsdoc-syntax">,
 204             </span><span class="jsdoc-var">draggable</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.draggable
 205         </span><span class="jsdoc-syntax">});
 206
 207         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
 208             </span><span class="jsdoc-var">map</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">_map</span><span class="jsdoc-syntax">,
 209             </span><span class="jsdoc-var">marker</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">_marker</span><span class="jsdoc-syntax">,
 210             </span><span class="jsdoc-var">circle</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 211             </span><span class="jsdoc-var">location</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">_marker.position</span><span class="jsdoc-syntax">,
 212             </span><span class="jsdoc-var">radius</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.radius</span><span class="jsdoc-syntax">,
 213             </span><span class="jsdoc-var">locationName</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.locationName</span><span class="jsdoc-syntax">,
 214             </span><span class="jsdoc-var">addressComponents</span><span class="jsdoc-syntax">: {
 215                 </span><span class="jsdoc-var">formatted_address</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 216                 </span><span class="jsdoc-var">addressLine1</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 217                 </span><span class="jsdoc-var">addressLine2</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 218                 </span><span class="jsdoc-var">streetName</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 219                 </span><span class="jsdoc-var">streetNumber</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 220                 </span><span class="jsdoc-var">city</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 221                 </span><span class="jsdoc-var">district</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 222                 </span><span class="jsdoc-var">state</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 223                 </span><span class="jsdoc-var">stateOrProvince</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null
 224             </span><span class="jsdoc-syntax">},
 225             </span><span class="jsdoc-var">settings</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,
 226             </span><span class="jsdoc-var">domContainer</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">,
 227             </span><span class="jsdoc-var">geodecoder</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">google.maps.Geocoder</span><span class="jsdoc-syntax">()
 228         };
 229     },
 230
 231     </span><span class="jsdoc-var">drawCircle</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">center</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">radius</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">options</span><span class="jsdoc-syntax">)
 232     {
 233         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.circle </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">) {
 234             </span><span class="jsdoc-var">this.gMapContext.circle.setMap</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
 235         }
 236         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">radius </span><span class="jsdoc-syntax">&gt; 0) {
 237             </span><span class="jsdoc-var">radius </span><span class="jsdoc-syntax">*= 1;
 238             </span><span class="jsdoc-var">options </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({}, </span><span class="jsdoc-var">options</span><span class="jsdoc-syntax">, {
 239                 </span><span class="jsdoc-var">strokeColor</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;#0000FF&quot;</span><span class="jsdoc-syntax">,
 240                 </span><span class="jsdoc-var">strokeOpacity</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">.</span><span class="jsdoc-syntax">35,
 241                 </span><span class="jsdoc-var">strokeWeight</span><span class="jsdoc-syntax">: 2,
 242                 </span><span class="jsdoc-var">fillColor</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;#0000FF&quot;</span><span class="jsdoc-syntax">,
 243                 </span><span class="jsdoc-var">fillOpacity</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">.</span><span class="jsdoc-syntax">2
 244             });
 245
 246             </span><span class="jsdoc-var">options.map </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.gMapContext.map</span><span class="jsdoc-syntax">;
 247             </span><span class="jsdoc-var">options.radius </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">radius</span><span class="jsdoc-syntax">;
 248             </span><span class="jsdoc-var">options.center </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">center</span><span class="jsdoc-syntax">;
 249             </span><span class="jsdoc-var">this.gMapContext.circle </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">google.maps.Circle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">options</span><span class="jsdoc-syntax">);
 250             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.gMapContext.circle</span><span class="jsdoc-syntax">;
 251         }
 252
 253         </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 254     },
 255
 256     </span><span class="jsdoc-var">setPosition</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">location</span><span class="jsdoc-syntax">)
 257     {
 258         </span><span class="jsdoc-var">this.gMapContext.location </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">location</span><span class="jsdoc-syntax">;
 259         </span><span class="jsdoc-var">this.gMapContext.marker.setPosition</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">location</span><span class="jsdoc-syntax">);
 260         </span><span class="jsdoc-var">this.gMapContext.map.panTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">location</span><span class="jsdoc-syntax">);
 261         </span><span class="jsdoc-var">this.drawCircle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">location</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.gMapContext.radius</span><span class="jsdoc-syntax">, {});
 262
 263         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 264
 265         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.settings.enableReverseGeocode</span><span class="jsdoc-syntax">) {
 266             </span><span class="jsdoc-var">this.gMapContext.geodecoder.geocode</span><span class="jsdoc-syntax">({
 267                 </span><span class="jsdoc-var">latLng</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.gMapContext.location
 268             </span><span class="jsdoc-syntax">}, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">results</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">status</span><span class="jsdoc-syntax">) {
 269
 270                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">status </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">google.maps.GeocoderStatus.OK </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">results.length </span><span class="jsdoc-syntax">&gt; 0) {
 271                     </span><span class="jsdoc-var">_this.gMapContext.locationName </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">results</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.formatted_address</span><span class="jsdoc-syntax">;
 272                     </span><span class="jsdoc-var">_this.gMapContext.addressComponents </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">_this.address_component_from_google_geocode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">results</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.address_components</span><span class="jsdoc-syntax">);
 273
 274                     </span><span class="jsdoc-var">_this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'positionchanged'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">location</span><span class="jsdoc-syntax">);
 275                 }
 276             });
 277
 278             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 279         }
 280
 281         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'positionchanged'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">location</span><span class="jsdoc-syntax">);
 282     },
 283
 284     </span><span class="jsdoc-var">resize</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 285     {
 286         </span><span class="jsdoc-var">google.maps.event.trigger</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.map</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;resize&quot;</span><span class="jsdoc-syntax">);
 287
 288         </span><span class="jsdoc-var">this.gMapContext.map.setCenter</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.gMapContext.marker.position</span><span class="jsdoc-syntax">);
 289
 290         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'resize'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 291     },
 292
 293     </span><span class="jsdoc-var">setPositionByLatLng</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">latitude</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">longitude</span><span class="jsdoc-syntax">)
 294     {
 295         </span><span class="jsdoc-var">this.setPosition</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">google.maps.LatLng</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">latitude</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">longitude</span><span class="jsdoc-syntax">));
 296     },
 297
 298     </span><span class="jsdoc-var">getCurrentPosition</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 299     {
 300         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
 301             </span><span class="jsdoc-var">latitude</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.gMapContext.location.lat</span><span class="jsdoc-syntax">(),
 302             </span><span class="jsdoc-var">longitude</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.gMapContext.location.lng</span><span class="jsdoc-syntax">()
 303         };
 304     },
 305
 306     </span><span class="jsdoc-var">getAddressName</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 307     {
 308         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.gMapContext.locationName</span><span class="jsdoc-syntax">;
 309     },
 310
 311     </span><span class="jsdoc-var">getAddressComponents</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 312     {
 313         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.gMapContext.addressComponents</span><span class="jsdoc-syntax">;
 314     },
 315
 316     </span><span class="jsdoc-var">address_component_from_google_geocode</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">address_components</span><span class="jsdoc-syntax">)
 317     {
 318         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">result </span><span class="jsdoc-syntax">= {};
 319
 320         </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">address_components.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
 321             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">component </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">address_components</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
 322             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">component.types.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;postal_code&quot;</span><span class="jsdoc-syntax">) &gt;= 0) {
 323                 </span><span class="jsdoc-var">result.postalCode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">component.short_name</span><span class="jsdoc-syntax">;
 324             } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">component.types.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;street_number&quot;</span><span class="jsdoc-syntax">) &gt;= 0) {
 325                 </span><span class="jsdoc-var">result.streetNumber </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">component.short_name</span><span class="jsdoc-syntax">;
 326             } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">component.types.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;route&quot;</span><span class="jsdoc-syntax">) &gt;= 0) {
 327                 </span><span class="jsdoc-var">result.streetName </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">component.short_name</span><span class="jsdoc-syntax">;
 328             } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">component.types.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;neighborhood&quot;</span><span class="jsdoc-syntax">) &gt;= 0) {
 329                 </span><span class="jsdoc-var">result.city </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">component.short_name</span><span class="jsdoc-syntax">;
 330             } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">component.types.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;locality&quot;</span><span class="jsdoc-syntax">) &gt;= 0) {
 331                 </span><span class="jsdoc-var">result.city </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">component.short_name</span><span class="jsdoc-syntax">;
 332             } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">component.types.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;sublocality&quot;</span><span class="jsdoc-syntax">) &gt;= 0) {
 333                 </span><span class="jsdoc-var">result.district </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">component.short_name</span><span class="jsdoc-syntax">;
 334             } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">component.types.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;administrative_area_level_1&quot;</span><span class="jsdoc-syntax">) &gt;= 0) {
 335                 </span><span class="jsdoc-var">result.stateOrProvince </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">component.short_name</span><span class="jsdoc-syntax">;
 336             } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">component.types.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;country&quot;</span><span class="jsdoc-syntax">) &gt;= 0) {
 337                 </span><span class="jsdoc-var">result.country </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">component.short_name</span><span class="jsdoc-syntax">;
 338             }
 339         }
 340
 341         </span><span class="jsdoc-var">result.addressLine1 </span><span class="jsdoc-syntax">= [ </span><span class="jsdoc-var">result.streetNumber</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">result.streetName </span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.join</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot; &quot;</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.trim</span><span class="jsdoc-syntax">();
 342         </span><span class="jsdoc-var">result.addressLine2 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">;
 343         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">result</span><span class="jsdoc-syntax">;
 344     },
 345
 346     </span><span class="jsdoc-var">setZoomLevel</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">zoom</span><span class="jsdoc-syntax">)
 347     {
 348         </span><span class="jsdoc-var">this.gMapContext.map.setZoom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">zoom</span><span class="jsdoc-syntax">);
 349     },
 350
 351     </span><span class="jsdoc-var">show</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 352     {
 353         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
 354             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 355         }
 356
 357         </span><span class="jsdoc-var">this.el.show</span><span class="jsdoc-syntax">();
 358
 359         </span><span class="jsdoc-var">this.resize</span><span class="jsdoc-syntax">();
 360
 361         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 362     },
 363
 364     </span><span class="jsdoc-var">hide</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 365     {
 366         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
 367             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 368         }
 369
 370         </span><span class="jsdoc-var">this.el.hide</span><span class="jsdoc-syntax">();
 371
 372         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'hide'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 373     }
 374
 375 });</span></code></body></html>