Skip to content

Latest commit

 

History

History
157 lines (118 loc) · 4.88 KB

File metadata and controls

157 lines (118 loc) · 4.88 KB

Cordova GoogleMaps plugin for iOS and Android (v1.4.0 - cold version)

This plugin is a thin wrapper for Google Maps Android API and Google Maps SDK for iOS. Both PhoneGap and Apache Cordova are supported.


Quick install

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.

Last release information

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.

Quick demo

<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>

Documentation

All documentations are here!!

Classes

If you want to use crosswalk, just follow this easy documentation. Install Plugin with Crosswalk


Join the official community

New versions will be announced through the official community. Stay tuned!

Chat

Join our online chat at
Gitter

Example

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

image