-
-
Save phantomtypist/65a3fbf6e8bd8cd74060d6b247e38b54 to your computer and use it in GitHub Desktop.
Google Maps API V3 extras for Mapstraction
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Smapping!</title> | |
| <link rel="stylesheet" type="text/css" href="/stylesheet.css"></link> | |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta> | |
| <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> | |
| <script type="text/javascript" src="/scripts/jquery-1.5.1.min.js"></script> | |
| <script type="text/javascript" src="/scripts/mxn/mxn.js?(googlev3,[geocoder],[extras])"></script> | |
| <script type="text/javascript"> | |
| var mapstraction; | |
| function initialize() { | |
| mapstraction = new mxn.Mapstraction('mymap','googlev3'); | |
| mapstraction.addExtras(); | |
| mapstraction.setCenterAndZoom(new mxn.LatLonPoint(37.75,-122.44), 8); | |
| mapstraction.enableScrollWheelZoom(); | |
| } | |
| $(document).ready(function() { initialize(); }); | |
| </script> | |
| </head> | |
| <body> | |
| <div id="header"> | |
| <h1>Mapstraction Google Extras</h1> | |
| </div> | |
| <div id="container"> | |
| <div id="mymap"></div> | |
| </div> | |
| <div id="footer"> | |
| </div> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Draggable markers extension to Mapstraction for Google V3 maps | |
| /** | |
| * Add some Google v3 goodies to baseline mapstraction. | |
| */ | |
| mxn.addProxyMethods( mxn.Mapstraction, [ | |
| /** | |
| * Add a method that can be called to add our extra stuff to an implementation. | |
| */ | |
| 'addExtras' | |
| ]); | |
| /* | |
| * Add reverse geocoding capabilities to the Google v3 geocoder | |
| */ | |
| mxn.addProxyMethods( mxn.Geocoder, [ | |
| 'reverseGeocode', | |
| 'reverseGeocodeCallback' | |
| ]); | |
| // Amend baseline implementation | |
| mxn.register( 'googlev3', { | |
| Mapstraction: { | |
| addExtras: function() { | |
| var me = this; | |
| me.markerAdded.addHandler( function( name, source, args ) { | |
| // enable dragend event for google | |
| args.marker.dragend = new mxn.Event( 'dragend', args.marker ); | |
| google.maps.event.addListener( args.marker.proprietary_marker, 'dragend', function() { | |
| var latlng = args.marker.proprietary_marker.getPosition(); | |
| args.marker.dragend.fire( { | |
| location: new mxn.LatLonPoint( latlng.lat(), latlng.lng() ) | |
| } ); | |
| }); | |
| // enable dragstart event for google | |
| args.marker.dragstart = new mxn.Event( 'dragstart', args.marker ); | |
| google.maps.event.addListener( args.marker.proprietary_marker, 'dragstart', function() { | |
| var latlng = args.marker.proprietary_marker.getPosition(); | |
| args.marker.dragend.fire( { | |
| location: new mxn.LatLonPoint( latlng.lat(), latlng.lng() ) | |
| } ); | |
| }); | |
| // enable drag event for google | |
| args.marker.drag = new mxn.Event( 'drag', args.marker ); | |
| google.maps.event.addListener( args.marker.proprietary_marker, 'drag', function() { | |
| var latlng = args.marker.proprietary_marker.getPosition(); | |
| args.marker.drag.fire( { | |
| location: new mxn.LatLonPoint( latlng.lat(), latlng.lng() ) | |
| } ); | |
| }); | |
| }); | |
| } | |
| } | |
| }); | |
| // Amend geocoder implementation | |
| mxn.register( 'googlev3', { | |
| Geocoder: { | |
| reverseGeocode: function(latlng) { | |
| var me = this; | |
| if (!latlng.hasOwnProperty('latLng')) { | |
| alert('No latLng specified.'); | |
| } | |
| this.geocoders[this.api].geocode(latlng, function(results, status) { | |
| me.reverseGeocodeCallback(results, status); | |
| }); | |
| }, | |
| reverseGeocodeCallback: function(result, status) { | |
| var return_location = {}; | |
| if (status != google.maps.GeocoderStatus.OK) { | |
| this.error_callback(status); | |
| } | |
| else { | |
| var results = []; | |
| for (var i = 0; i < result.length; i++) | |
| { | |
| if (result[0].formatted_address) | |
| { | |
| results[i] = result[i].formatted_address; | |
| } | |
| } | |
| me.callback(return_location); | |
| } | |
| } | |
| } | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment