UNPKG

googlemaps-v3-utility-library

Version:
227 lines 8.58 kB
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Geolocation Marker Reference</title> <link rel="stylesheet" type="text/css" href="//code.google.com/css/codesite.css" /> <link rel="stylesheet" type="text/css" href="//google-maps-utility-library-v3.googlecode.com/svn/trunk/util/docs/template/local_extensions.css" /> <script type="text/javascript" src="//code.google.com/js/prettify.js"></script> </head> <body onload="prettyPrint()"> <h1>Geolocation Marker for Google Maps v3</h1> <p>This library uses geolocation to add a marker and accuracy circle to a map. The marker position is automatically updated as the user position changes.</p> <p><img alt="" src="//google-maps-utility-library-v3.googlecode.com/svn/trunk/geolocationmarker/images/example.png" width="300" height="219" /></p> <p>To add the Geolocation Marker, just instantiate a new GeolocationMarker object, passing your map to it: </p> <pre class="prettyprint">var mapOptions = { zoom: 17, center: new google.maps.LatLng(-34.397, 150.644), mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions); var GeoMarker = new GeolocationMarker(map);</pre> <p>See the <a href="https://google-maps-utility-library-v3.googlecode.com/svn/trunk/geolocationmarker/examples/mylocation.html">example</a>.</p> <p style="font-style:italic;">Note: This library will only function in browsers supporting the <a href="http://dev.w3.org/geo/api/spec-source.html">W3C Geolocation API</a>. This excludes Internet Explorer versions 8 and older.</p> <h2 id="GeolocationMarker">class GeolocationMarker</h2> <p>This class extends <a href="https://developers.google.com/maps/documentation/javascript/reference#MVCObject">google.maps.MVCObject</a>.</p> <h3>Constructor</h3> <table style="width:90%"> <tbody> <tr> <th>Constructor</th> <th>Description</th> </tr> <tr class="odd"> <td> <code>GeolocationMarker(map?:<a href="https://developers.google.com/maps/documentation/javascript/reference#Map">google.maps.Map</a>, marker_opts?:<a href="https://developers.google.com/maps/documentation/javascript/reference#MarkerOptions">google.maps.MarkerOptions</a>, circle_opts?:<a href="https://developers.google.com/maps/documentation/javascript/reference#CircleOptions">google.maps.CircleOptions</a>)</code> </td> <td> A marker and accuracy circle positioned on the map to track the user's location. </td> </tr> </tbody> </table> <h3>Methods</h3> <table style="width:90%"> <tbody> <tr> <th>Methods</th> <th>Return&nbsp;Value</th> <th>Description</th> </tr> <tr class="odd"> <td> <code>getAccuracy()</code> </td> <td> <code>number|null</code> </td> <td> Returns the current accuracy of the location data. Will return <code>null</code> if a position has not yet been obtained. </td> </tr> <tr class="even"> <td> <code>getBounds()</code> </td> <td> <code><a href="https://developers.google.com/maps/documentation/javascript/reference#LatLngBounds"> google.maps.LatLngBounds</a>|null</code> </td> <td> Returns the lat/lng bounds containing the marker and accuracy circle. Will return <code>null</code> if a position has not yet been obtained. </td> </tr> <tr class="odd"> <td> <code>getMap()</code> </td> <td> <code><a href="https://developers.google.com/maps/documentation/javascript/reference#Map"> google.maps.Map</a></code> </td> <td> </td> </tr> <tr class="even"> <td> <code>getMinimumAccuracy()</code> </td> <td> <code>number|null</code> </td> <td> Returns the minimum accuracy (in meters) that must be achieved before the marker is initially drawn on the map. Returns <code>null</code> if no minimum is specified. </td> </tr> <tr class="odd"> <td> <code>getPosition()</code> </td> <td> <code><a href="https://developers.google.com/maps/documentation/javascript/reference#LatLng"> google.maps.LatLng</a>|null</code> </td> <td> Returns the center of the marker and accuracy circle. Will return <code>null</code> if a position has not yet been obtained. </td> </tr> <tr class="even"> <td> <code>getPositionOptions()</code> </td> <td> <code><a href="http://dev.w3.org/geo/api/spec-source.html#position_options_interface"> PositionOptionsInterface</a></code> </td> <td> Returns the current options used to call the <a href="http://dev.w3.org/geo/api/spec-source.html#watch-position">geolocation.watchPosition</a> method. </td> </tr> <tr class="odd"> <td> <code>setCircleOptions(options:<a href="https://developers.google.com/maps/documentation/javascript/reference#CircleOptions">google.maps.CircleOptions</a>)</code> </td> <td> </td> <td> This method will ignore certain properties of the <a href="https://developers.google.com/maps/documentation/javascript/reference#CircleOptions"> google.maps.CircleOptions</a> object. It will ignore <code>position</code>, <code>radius</code> and <code>map</code> properties as these are set by the library. </td> </tr> <tr class="even"> <td> <code>setMap(map:<a href="https://developers.google.com/maps/documentation/javascript/reference#Map">google.maps.Map</a>)</code> </td> <td> </td> <td> </td> </tr> <tr class="odd"> <td> <code>setMarkerOptions(options:<a href="https://developers.google.com/maps/documentation/javascript/reference#MarkerOptions">google.maps.MarkerOptions</a>)</code> </td> <td> </td> <td> This method will ignore certain properties of the <a href="https://developers.google.com/maps/documentation/javascript/reference#MarkerOptions"> google.maps.MarkerOptions</a> object. It will ignore <code>position</code> and <code>map</code> properties as these are set by the library. </td> </tr> <tr class="even"> <td> <code>setMinimumAccuracy(accuracy:number|null)</code> </td> <td></td> <td> Sets the minimum accuracy (in meters) that must be achieved before the marker is initially drawn on the map. </td> </tr> <tr class="odd"> <td> <code>setPositionOptions(positionOpts:<a href="http://dev.w3.org/geo/api/spec-source.html#position_options_interface"> PositionOptionsInterface</a>)</code> </td> <td></td> <td> Sets the options used to call the <a href="http://dev.w3.org/geo/api/spec-source.html#watch-position">geolocation.watchPosition</a> method. </td> </tr> </tbody> </table> <h3>Events</h3> <table style="width:90%"> <tbody> <tr> <th>Events</th> <th>Arguments</th> <th>Description</th> </tr> <tr class="odd"> <td> <code>accuracy_changed</code> </td> <td></td> <td></td> </tr> <tr class="even"> <td> <code>geolocation_error</code> </td> <td> <code><a href="http://dev.w3.org/geo/api/spec-source.html#position_error_interface"> PositionErrorInterface</a></code> </td> <td> Triggered whenever geolocation fails. Can be caused by a user denying permission to access location data. </td> </tr> <tr class="odd"> <td> <code>position_changed</code> </td> <td></td> <td></td> </tr> </tbody> </table> </body> </html>