This plugin is a thin wrapper for Google Maps Android API and Google Maps SDK for iOS. Both PhoneGap and Apache Cordova are supported.
Before you install, make sure you've read the instructions
npm (current stable 1.4.0)
$> cordova plugin add cordova-plugin-googlemaps --variable API_KEY_FOR_ANDROID="YOUR_ANDROID_API_KEY_IS_HERE" --variable API_KEY_FOR_IOS="YOUR_IOS_API_KEY_IS_HERE"
Github (current master, potentially unstable)
$> cordova plugin add https://github.com/mapsplugin/cordova-plugin-googlemaps --variable API_KEY_FOR_ANDROID="YOUR_ANDROID_API_KEY_IS_HERE" --variable API_KEY_FOR_IOS="YOUR_IOS_API_KEY_IS_HERE"
If you re-install the plugin, please always remove the plugin first, then remove the SDK
$> cordova plugin rm cordova-plugin-googlemaps
$> cordova plugin rm com.googlemaps.ios
$> cordova plugin add cordova-plugin-googlemaps --variable API_KEY_FOR_ANDROID="YOUR_ANDROID_API_KEY_IS_HERE" --variable API_KEY_FOR_IOS="YOUR_IOS_API_KEY_IS_HERE"
The SDK-Plugin won't be uninstalled automatically and you will stuck on an old version.
v1.4.0 - 04/Nov/2016 (cold version)
- Lots of bugs are fixed.
- Improve performance (especially adding markers using the same url)
- Updated Google Maps SDK for iOS to 2.1.1
- StyledMapType is available.
<script type="text/javascript">
var map;
document.addEventListener("deviceready", function() {
var div = document.getElementById("map_canvas");
// Initialize the map view
map = plugin.google.maps.Map.getMap(div);
// Wait until the map is ready status.
map.addEventListener(plugin.google.maps.event.MAP_READY, onMapReady);
}, false);
function onMapReady() {
var button = document.getElementById("button");
button.addEventListener("click", onBtnClicked);
}
function onBtnClicked() {
// Move to the position with animation
map.animateCamera({
target: {lat: 37.422359, lng: -122.084344},
zoom: 17,
tilt: 60,
bearing: 140,
duration: 5000
}, function() {
// Add a maker
map.addMarker({
position: {lat: 37.422359, lng: -122.084344},
title: "Welecome to \n" +
"Cordova GoogleMaps plugin for iOS and Android",
snippet: "This plugin is awesome!",
animation: plugin.google.maps.Animation.BOUNCE
}, function(marker) {
// Show the info window
marker.showInfoWindow();
// Catch the click event
marker.on(plugin.google.maps.event.INFO_CLICK, function() {
// To do something...
alert("Hello world!");
});
});
});
}
</script>
-
- Automatic Installation
- Tutorials
- Upgrade
- Just re-install this plugin
- Map
- Marker
- Circle
- Polyline
- Polygon
- Tile Overlay
- Ground Overlay
- Kml Overlay
- LatLng
- LatLngBounds
- CameraPosition
- Location
- Geocoder
- BaseClass
- External Service
If you want to use crosswalk, just follow this easy documentation. Install Plugin with Crosswalk
New versions will be announced through the official community. Stay tuned!
You can see an example here. (old version, but all most the same)
cordova-googlemaps-plugin-v1.2.5.apk
$> adb install cordova-googlemaps-plugin-v1.2.5.apk