Skip to content

cdarken/MapKit

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

32 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

MapKit plugin for iOS and Android

Uses Apple Maps on iOS and Google Maps v2 on Android

Currently only works/tested on Android and iOS.

Cordova Map 1

Cordova Map 2

Cordova Map 3

Cordova Map 4

Android specific

You need a Google Maps Android v2 API KEY from google and you need to specify it when you install the plugin

You can install this plugin with plugman

plugman --platform android --project android-mapkit-example/ --plugin MapKit --variable API_KEY="YOUR_API_KEY_FROM_GOOGLE"

Sample code

var app = {
    showMap: function() {
        var pins = [[49.28115, -123.10450], [49.27503, -123.12138], [49.28286, -123.11891]];
        var error = function() {
          console.log('error');
        };
        var success = function() {
          mapKit.addMapPins(pins, function() { 
                                      console.log('adMapPins success');  
                                  },
                                  function() { console.log('error'); });
        };
        mapKit.showMap(success, error);
    },
    hideMap: function() {
        var success = function() {
          console.log('Map hidden');
        };
        var error = function() {
          console.log('error');
        };
        mapKit.hideMap(success, error);
    },
    clearMapPins: function() {
        var success = function() {
          console.log('Map Pins cleared!');
        };
        var error = function() {
          console.log('error');
        };
        mapKit.clearMapPins(success, error);
    },
    changeMapType: function() {
        var success = function() {
          console.log('Map Type Changed');
        };
        var error = function() {
          console.log('error');
        };
        mapKit.changeMapType(mapKit.mapType.MAP_TYPE_SATELLITE, success, error);
    }
}

Configuration

Edit the options in MapKit.js to suit your needs

this.options = {
  height: 460, // height of the map (width is always full size for now)
  diameter: 1000,   // unused for now
  atBottom: true,   // bottom or top of the webview
  lat: 49.281468,   // initial camera position latitude
  lon: -123.104446  // initial camera position latitude
};

Sample App

Checkout the sample/ application as a boilerplate!

Missing features

Info bubbles: Simple info bubbles supported (title, snippet and custom icons for markers). Custom info bubbles not supported (i.e HTML bubbles etc..).

About

Cordova MapKit plugin

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 71.5%
  • Objective-C 12.1%
  • CSS 8.7%
  • Java 7.7%