mirror of
https://github.com/danielsogl/awesome-cordova-plugins.git
synced 2025-03-04 00:13:06 +08:00
feat(google-maps): update plugin and fix a few issues (#1834)
* Update index.ts * Update index.ts * Add missing features, and bug fix of methods * update: classname must be in pascal case * remove: duplicated class definition * export encode and spherical static classes * Add comma * Fix Encoding and Spherical * Add convenience methods * Fix decorators for Encoding and Spherical * Update: getMap() methods return the instance of the wrapper plugin * Update: getMap() methods return the instance of the wrapper plugin * Remove `@CordovaInstance` decorators from getMap() * Update: GoogleMapOptions (all fields are not optional). * Follow up: version `2.0.0-beta2-20170719-2226` of cordova-plugin-googlemaps * Fix: tslint error * Fix: tslint error * No more isAvailable() method. * Bug fix: description is incorrect * Bug fix: example code was wrong. * Bug fix: HtmlInfoWindow does not work https://github.com/ionic-team/ionic-native/pull/1815#issuecomment-318909795 * Bug fix: HtmlInfoWindow does not work * Bug fix: HtmlInfoWindow does not work * Bug fix: HtmlInfoWindow does not work * Bug fix: HtmlInfoWindow does not work * It seems the ionViewDidLoad() is enough delayed after platform.ready() * Bug fix: map.setDiv() * Bug fix: HtmlInfoWindow does not work * Bug fix: BaseArrayClass definition is incorrect * Bug fix: BaseArrayClass constructor is wrong * Bug fix: Geocoder class does not work * Bug fix: LatLngBounds constructor is wrong * update: noNotify option is not declared * Bug fix: Geocoder.geocode() returns array of GeocoderResult * Update: clarify acceptable parameters of BaseArrayClass * Add: AnimateCameraOption.padding is missing * Revert: BaseClass.empty() method does not have the noNotify option * Add `destruct` option to the CordovaOption. - This allows BaseClass.on() is able to pass multiple retuned values from the cordova plugin side to the event lister. * A semicolon is mixing * update: event names * Update: BaseClass.addEventListener(), addEventListenerOnce(), on(), and one() * Add: destruct option for otherPromise Change: inside event names (must use the version 2.0.0-beta3-20170808-1950 or higher) * Build for working group * Bug fix: map.getCameraTarget() definition is incorrect * Bug fix: The definition of VisibleRegion interface is incorrect * Fix: LatLng, LatLngBounds, and PolylineOptions classes Update: map.getVisibleRegion() Add: VisibleRegion class * Bug fix: the definition of map.clear() method is incorrect * Fix: map.fromLatLngToPoint() * Ignore the dist directory on the master branch * Remove the dist folder on the master branch * fixes and tweaks * use union types for CameraPosition fixes issue mentioned on slack by @wf9a5m75 * fix types * update AnimateCameraOptions interface * remove AnimateCameraOptions interface * add MarkerCluster class
This commit is contained in:
Masashi Katsumata
Ibby Hadeed
parent
21045ea535
commit
c11aec33a7
2
.gitignore
vendored
2
.gitignore
vendored
@ -3,5 +3,5 @@ node_modules/
|
||||
.idea
|
||||
.tmp
|
||||
aot/
|
||||
dist/
|
||||
scripts/ionic-native-bower
|
||||
dist/
|
||||
|
||||
@ -2,6 +2,7 @@ import 'core-js';
|
||||
import { Plugin, Cordova, CordovaProperty, CordovaCheck, CordovaInstance, InstanceProperty } from './decorators';
|
||||
import { IonicNativePlugin } from './ionic-native-plugin';
|
||||
import { ERR_CORDOVA_NOT_AVAILABLE, ERR_PLUGIN_NOT_INSTALLED } from './plugin';
|
||||
import { Observable } from 'rxjs/Observable';
|
||||
|
||||
declare const window: any;
|
||||
|
||||
@ -47,6 +48,17 @@ class TestPlugin extends IonicNativePlugin {
|
||||
return new TestObject(TestPlugin.getPlugin().create());
|
||||
}
|
||||
|
||||
@Cordova({
|
||||
destruct: true
|
||||
})
|
||||
destructPromise(): Promise<any> { return; }
|
||||
|
||||
@Cordova({
|
||||
destruct: true,
|
||||
observable: true
|
||||
})
|
||||
destructObservable(): Observable<any> { return; }
|
||||
|
||||
}
|
||||
|
||||
function definePlugin() {
|
||||
@ -59,7 +71,9 @@ function definePlugin() {
|
||||
this.ping = (success: Function, error: Function) => success('pong');
|
||||
this.name = 'John Smith';
|
||||
return this;
|
||||
}
|
||||
},
|
||||
destructPromise: (success: Function) => success('hello', 'world'),
|
||||
destructObservable: (success: Function) => success('hello', 'world')
|
||||
};
|
||||
}
|
||||
|
||||
@ -177,6 +191,30 @@ describe('Regular Decorators', () => {
|
||||
|
||||
});
|
||||
|
||||
describe('CordovaOptions', () => {
|
||||
|
||||
describe('destruct', () => {
|
||||
|
||||
it('should destruct values returned by a Promise', (done) => {
|
||||
plugin.destructPromise()
|
||||
.then((args: any[]) => {
|
||||
expect(args).toEqual(['hello', 'world']);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('should destruct values returned by an Observable', (done) => {
|
||||
plugin.destructObservable()
|
||||
.subscribe((args: any[]) => {
|
||||
expect(args).toEqual(['hello', 'world']);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('Instance Decorators', () => {
|
||||
|
||||
@ -37,6 +37,7 @@ export interface PluginConfig {
|
||||
}
|
||||
|
||||
export interface CordovaOptions {
|
||||
destruct?: boolean;
|
||||
/**
|
||||
* Set to true if the wrapped method is a sync function
|
||||
*/
|
||||
@ -252,7 +253,7 @@ export function Cordova(opts: CordovaOptions = {}) {
|
||||
*
|
||||
* Wrap an instance method
|
||||
*/
|
||||
export function CordovaInstance(opts: any = {}) {
|
||||
export function CordovaInstance(opts: CordovaOptions = {}) {
|
||||
return (target: Object, methodName: string) => {
|
||||
return {
|
||||
value: function(...args: any[]) {
|
||||
|
||||
@ -136,7 +136,11 @@ function callCordovaPlugin(pluginObj: any, methodName: string, args: any[], opts
|
||||
function wrapPromise(pluginObj: any, methodName: string, args: any[], opts: any = {}) {
|
||||
let pluginResult: any, rej: Function;
|
||||
const p = getPromise((resolve: Function, reject: Function) => {
|
||||
if (opts.destruct) {
|
||||
pluginResult = callCordovaPlugin(pluginObj, methodName, args, opts, (...args: any[]) => resolve(args), (...args: any[]) => reject(args));
|
||||
} else {
|
||||
pluginResult = callCordovaPlugin(pluginObj, methodName, args, opts, resolve, reject);
|
||||
}
|
||||
rej = reject;
|
||||
});
|
||||
// Angular throws an error on unhandled rejection, but in this case we have already printed
|
||||
@ -166,7 +170,14 @@ function wrapOtherPromise(pluginObj: any, methodName: string, args: any[], opts:
|
||||
|
||||
function wrapObservable(pluginObj: any, methodName: string, args: any[], opts: any = {}) {
|
||||
return new Observable(observer => {
|
||||
let pluginResult = callCordovaPlugin(pluginObj, methodName, args, opts, observer.next.bind(observer), observer.error.bind(observer));
|
||||
let pluginResult;
|
||||
|
||||
if (opts.destruct) {
|
||||
pluginResult = callCordovaPlugin(pluginObj, methodName, args, opts, (...args: any[]) => observer.next(args), (...args: any[]) => observer.error(args));
|
||||
} else {
|
||||
pluginResult = callCordovaPlugin(pluginObj, methodName, args, opts, observer.next.bind(observer), observer.error.bind(observer));
|
||||
}
|
||||
|
||||
if (pluginResult && pluginResult.error) {
|
||||
observer.error(pluginResult.error);
|
||||
observer.complete();
|
||||
@ -266,7 +277,14 @@ export function wrapInstance(pluginObj: any, methodName: string, opts: any = {})
|
||||
} else if (opts.observable) {
|
||||
|
||||
return new Observable(observer => {
|
||||
let pluginResult = callInstance(pluginObj, methodName, args, opts, observer.next.bind(observer), observer.error.bind(observer));
|
||||
|
||||
let pluginResult;
|
||||
|
||||
if (opts.destruct) {
|
||||
pluginResult = callInstance(pluginObj, methodName, args, opts, (...args: any[]) => observer.next(args), (...args: any[]) => observer.error(args));
|
||||
} else {
|
||||
pluginResult = callInstance(pluginObj, methodName, args, opts, observer.next.bind(observer), observer.error.bind(observer));
|
||||
}
|
||||
|
||||
if (pluginResult && pluginResult.error) {
|
||||
observer.error(pluginResult.error);
|
||||
@ -287,9 +305,13 @@ export function wrapInstance(pluginObj: any, methodName: string, opts: any = {})
|
||||
});
|
||||
|
||||
} else if (opts.otherPromise) {
|
||||
|
||||
return getPromise((resolve: Function, reject: Function) => {
|
||||
let result = callInstance(pluginObj, methodName, args, opts, resolve, reject);
|
||||
let result;
|
||||
if (opts.destruct) {
|
||||
result = callInstance(pluginObj, methodName, args, opts, (...args: any[]) => resolve(args), (...args: any[]) => reject(args));
|
||||
} else {
|
||||
result = callInstance(pluginObj, methodName, args, opts, resolve, reject);
|
||||
}
|
||||
if (result && !!result.then) {
|
||||
result.then(resolve, reject);
|
||||
} else {
|
||||
@ -298,8 +320,24 @@ export function wrapInstance(pluginObj: any, methodName: string, opts: any = {})
|
||||
});
|
||||
|
||||
} else {
|
||||
let pluginResult: any, rej: Function;
|
||||
const p = getPromise((resolve: Function, reject: Function) => {
|
||||
if (opts.destruct) {
|
||||
pluginResult = callInstance(pluginObj, methodName, args, opts, (...args: any[]) => resolve(args), (...args: any[]) => reject(args));
|
||||
} else {
|
||||
pluginResult = callInstance(pluginObj, methodName, args, opts, resolve, reject);
|
||||
}
|
||||
rej = reject;
|
||||
});
|
||||
// Angular throws an error on unhandled rejection, but in this case we have already printed
|
||||
// a warning that Cordova is undefined or the plugin is uninstalled, so there is no reason
|
||||
// to error
|
||||
if (pluginResult && pluginResult.error) {
|
||||
p.catch(() => { });
|
||||
typeof rej === 'function' && rej(pluginResult.error);
|
||||
}
|
||||
return p;
|
||||
|
||||
return getPromise((resolve: Function, reject: Function) => callInstance(pluginObj, methodName, args, opts, resolve, reject));
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,64 +1,161 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { Cordova, CordovaInstance, Plugin, InstanceProperty, InstanceCheck, checkAvailability, IonicNativePlugin } from '@ionic-native/core';
|
||||
import { Observable } from 'rxjs/Observable';
|
||||
import { Observer } from 'rxjs/Observer';
|
||||
import 'rxjs/add/observable/fromEvent';
|
||||
|
||||
|
||||
export type MapType = 'MAP_TYPE_NORMAL' | 'MAP_TYPE_ROADMAP' | 'MAP_TYPE_SATELLITE' | 'MAP_TYPE_HYBRID' | 'MAP_TYPE_TERRAIN' | 'MAP_TYPE_NONE';
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
*/
|
||||
export class LatLng implements ILatLng {
|
||||
|
||||
lat: number;
|
||||
lng: number;
|
||||
|
||||
constructor(lat: number, lng: number) {
|
||||
this.lat = lat;
|
||||
this.lng = lng;
|
||||
}
|
||||
|
||||
equals(other: ILatLng): boolean {
|
||||
return this.lat === other.lat && this.lng === other.lng;
|
||||
}
|
||||
|
||||
toString(): string {
|
||||
return this.lat + ',' + this.lng;
|
||||
}
|
||||
|
||||
toUrlValue(precision?: number): string {
|
||||
precision = precision || 6;
|
||||
|
||||
return this.lat.toFixed(precision) + ',' + this.lng.toFixed(precision);
|
||||
}
|
||||
}
|
||||
|
||||
export interface ILatLngBounds {
|
||||
northeast: ILatLng;
|
||||
southwest: ILatLng;
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
*/
|
||||
export class LatLngBounds implements ILatLngBounds {
|
||||
|
||||
private _objectInstance: any;
|
||||
|
||||
@InstanceProperty northeast: ILatLng;
|
||||
@InstanceProperty southwest: ILatLng;
|
||||
@InstanceProperty type: string;
|
||||
|
||||
constructor(points?: ILatLng[]) {
|
||||
this._objectInstance = new (GoogleMaps.getPlugin()).LatLngBounds(points);
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts to string
|
||||
* @return {string}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
toString(): string { return; }
|
||||
|
||||
/**
|
||||
* Returns a string of the form "lat_sw,lng_sw,lat_ne,lng_ne" for this bounds, where "sw" corresponds to the southwest corner of the bounding box, while "ne" corresponds to the northeast corner of that box.
|
||||
* @param precision {number}
|
||||
* @return {string}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
toUrlValue(precision?: number): string { return; }
|
||||
|
||||
/**
|
||||
* Extends this bounds to contain the given point.
|
||||
* @param LatLng {ILatLng}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
extend(LatLng: ILatLng): void {}
|
||||
|
||||
/**
|
||||
* Returns true if the given lat/lng is in this bounds.
|
||||
* @param LatLng {ILatLng}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
contains(LatLng: ILatLng): boolean { return; }
|
||||
|
||||
/**
|
||||
* Computes the center of this LatLngBounds
|
||||
* @return {LatLng}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
getCenter(): LatLng { return; }
|
||||
}
|
||||
|
||||
export interface GoogleMapOptions {
|
||||
|
||||
mapType?: MapType;
|
||||
|
||||
controls?: {
|
||||
|
||||
/**
|
||||
* Turns the compass on or off.
|
||||
*/
|
||||
compass?: boolean;
|
||||
|
||||
/**
|
||||
* Turns the myLocation picker on or off. If turns on this button, the application displays a permission dialog to obtain the geolocation data.
|
||||
*/
|
||||
myLocationButton?: boolean;
|
||||
|
||||
/**
|
||||
* Turns the indoor picker on or off.
|
||||
*/
|
||||
indoorPicker?: boolean;
|
||||
|
||||
/**
|
||||
* Turns the map toolbar on or off. This option is for Android only.
|
||||
*/
|
||||
mapToolbar?: boolean
|
||||
mapToolbar?: boolean;
|
||||
};
|
||||
|
||||
gestures?: {
|
||||
scroll?: boolean;
|
||||
tilt?: boolean;
|
||||
zoom?: boolean;
|
||||
rotate?: boolean;
|
||||
};
|
||||
|
||||
/**
|
||||
* Map styles
|
||||
* @ref https://developers.google.com/maps/documentation/javascript/style-reference
|
||||
*/
|
||||
styles?: any[];
|
||||
|
||||
/**
|
||||
* Initial camera position
|
||||
*/
|
||||
camera?: CameraPosition;
|
||||
camera?: CameraPosition<any>;
|
||||
|
||||
preferences?: {
|
||||
|
||||
/**
|
||||
* Minimum and maximum zoom levels for zooming gestures.
|
||||
*/
|
||||
zoom?: {
|
||||
minZoom?: number;
|
||||
maxZoom?: number;
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* Paddings of controls.
|
||||
*/
|
||||
padding?: {
|
||||
left?: number,
|
||||
top?: number,
|
||||
bottom?: number,
|
||||
right?: number
|
||||
},
|
||||
left?: number;
|
||||
top?: number;
|
||||
bottom?: number;
|
||||
right?: number;
|
||||
};
|
||||
|
||||
/**
|
||||
* Turns the 3D buildings layer on or off.
|
||||
*/
|
||||
@ -66,34 +163,11 @@ export interface GoogleMapOptions {
|
||||
};
|
||||
}
|
||||
|
||||
export interface AnimateCameraOptions {
|
||||
/**
|
||||
* Center position of the camera target.
|
||||
*/
|
||||
target?: ILatLng | Array<ILatLng> | LatLngBounds;
|
||||
/**
|
||||
* View angle of camera from 0 to 90
|
||||
*/
|
||||
tilt?: number;
|
||||
/**
|
||||
* Zoom level from 0 to 20
|
||||
*/
|
||||
zoom?: number;
|
||||
/**
|
||||
* Heading from 0 to 359
|
||||
*/
|
||||
bearing?: number;
|
||||
/**
|
||||
* Duration of camera animation in milli seconds
|
||||
*/
|
||||
duration?: number;
|
||||
}
|
||||
|
||||
export interface CameraPosition {
|
||||
export interface CameraPosition<T> {
|
||||
/**
|
||||
* The center location of the camera view.
|
||||
*/
|
||||
target?: ILatLng | LatLngBounds | ILatLng[];
|
||||
target?: T;
|
||||
/**
|
||||
* View angle
|
||||
*/
|
||||
@ -110,6 +184,10 @@ export interface CameraPosition {
|
||||
* The duration of animation in milliseconds
|
||||
*/
|
||||
duration?: number;
|
||||
/**
|
||||
* Camera padding in pixel
|
||||
*/
|
||||
padding?: number;
|
||||
}
|
||||
|
||||
export interface CircleOptions {
|
||||
@ -260,6 +338,23 @@ export interface MarkerOptions {
|
||||
disableAutoPan?: boolean;
|
||||
}
|
||||
|
||||
export interface MarkerClusterIcon {
|
||||
min: number;
|
||||
max: number;
|
||||
url: string;
|
||||
anchor: {
|
||||
x: number;
|
||||
y: number;
|
||||
};
|
||||
}
|
||||
|
||||
export interface MarkerClusterOptions {
|
||||
maxZoomLevel?: number;
|
||||
boundsDraw?: boolean;
|
||||
markers: MarkerOptions[];
|
||||
icons: MarkerClusterIcon[];
|
||||
}
|
||||
|
||||
export interface MyLocation {
|
||||
latLng?: LatLng;
|
||||
elapsedRealtimeNanos?: any;
|
||||
@ -284,7 +379,7 @@ export interface PolygonOptions {
|
||||
fillColor?: string;
|
||||
visible?: boolean;
|
||||
zIndex?: number;
|
||||
addHole?: Array<LatLng>;
|
||||
addHole?: Array<Array<LatLng>>;
|
||||
}
|
||||
|
||||
export interface PolylineOptions {
|
||||
@ -304,9 +399,48 @@ export interface TileOverlayOptions {
|
||||
opacity?: number;
|
||||
}
|
||||
|
||||
export interface VisibleRegion {
|
||||
northeast?: any;
|
||||
southwest?: any;
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
*/
|
||||
export class VisibleRegion implements ILatLngBounds {
|
||||
private _objectInstance: any;
|
||||
|
||||
@InstanceProperty northeast: ILatLng;
|
||||
@InstanceProperty southwest: ILatLng;
|
||||
@InstanceProperty farLeft: ILatLng;
|
||||
@InstanceProperty farRight: ILatLng;
|
||||
@InstanceProperty nearLeft: ILatLng;
|
||||
@InstanceProperty nearRight: ILatLng;
|
||||
@InstanceProperty type: string;
|
||||
|
||||
constructor(southwest: LatLngBounds, northeast: LatLngBounds, farLeft: ILatLng, farRight: ILatLng, nearLeft: ILatLng, nearRight: ILatLng) {
|
||||
this._objectInstance = new (GoogleMaps.getPlugin()).VisibleRegion(southwest, northeast, farLeft, farRight, nearLeft, nearRight);
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts to string
|
||||
* @return {string}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
toString(): string { return; }
|
||||
|
||||
/**
|
||||
* Returns a string of the form "lat_sw,lng_sw,lat_ne,lng_ne" for this bounds, where "sw" corresponds to the southwest corner of the bounding box, while "ne" corresponds to the northeast corner of that box.
|
||||
* @param precision {number}
|
||||
* @return {string}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
toUrlValue(precision?: number): string { return; }
|
||||
|
||||
|
||||
/**
|
||||
* Returns true if the given lat/lng is in this bounds.
|
||||
* @param LatLng {ILatLng}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
contains(LatLng: ILatLng): boolean { return; }
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
@ -315,6 +449,7 @@ export interface VisibleRegion {
|
||||
*/
|
||||
export const GoogleMapsEvent: { [eventName: string]: string; } = {
|
||||
MAP_READY: 'map_ready',
|
||||
MAP_LOADED: 'map_loaded',
|
||||
MAP_CLICK: 'map_click',
|
||||
MAP_LONG_CLICK: 'map_long_click',
|
||||
MY_LOCATION_BUTTON_CLICK: 'my_location_button_click',
|
||||
@ -323,18 +458,23 @@ export const GoogleMapsEvent: { [eventName: string]: string; } = {
|
||||
CAMERA_MOVE_START: 'camera_move_start',
|
||||
CAMERA_MOVE: 'camera_move',
|
||||
CAMERA_MOVE_END: 'camera_move_end',
|
||||
OVERLAY_CLICK: 'overlay_click',
|
||||
POLYGON_CLICK: 'polygon_click',
|
||||
POLYLINE_CLICK: 'polyline_click',
|
||||
CIRCLE_CLICK: 'circle_click',
|
||||
GROUND_OVERLAY_CLICK: 'ground_overlay_click',
|
||||
GROUND_OVERLAY_CLICK: 'groundoverlay_click',
|
||||
INFO_CLICK: 'info_click',
|
||||
INFO_LONG_CLICK: 'info_long_click',
|
||||
INFO_CLOSE: 'info_close',
|
||||
INFO_OPEN: 'info_open',
|
||||
CLUSTER_CLICK: 'cluster_click',
|
||||
MARKER_CLICK: 'marker_click',
|
||||
MARKER_DRAG: 'marker_drag',
|
||||
MARKER_DRAG_START: 'marker_drag_start',
|
||||
MARKER_DRAG_END: 'marker_drag_end'
|
||||
MARKER_DRAG_END: 'marker_drag_end',
|
||||
MAP_DRAG: 'map_drag',
|
||||
MAP_DRAG_START: 'map_drag_start',
|
||||
MAP_DRAG_END: 'map_drag_end'
|
||||
};
|
||||
|
||||
/**
|
||||
@ -368,67 +508,68 @@ export const GoogleMapsMapTypeId: { [mapType: string]: MapType; } = {
|
||||
* GoogleMaps,
|
||||
* GoogleMap,
|
||||
* GoogleMapsEvent,
|
||||
* LatLng,
|
||||
* GoogleMapOptions,
|
||||
* CameraPosition,
|
||||
* MarkerOptions,
|
||||
* Marker
|
||||
* } from '@ionic-native/google-maps';
|
||||
* import { Component } from "@angular/core/";
|
||||
*
|
||||
* export class MapPage {
|
||||
* @Component({
|
||||
* selector: 'page-home',
|
||||
* templateUrl: 'home.html'
|
||||
* })
|
||||
* export class HomePage {
|
||||
* map: GoogleMap;
|
||||
* mapElement: HTMLElement;
|
||||
* constructor(private googleMaps: GoogleMaps) { }
|
||||
*
|
||||
* // Load map only after view is initialized
|
||||
* ngAfterViewInit() {
|
||||
* ionViewDidLoad() {
|
||||
* this.loadMap();
|
||||
* }
|
||||
*
|
||||
* loadMap() {
|
||||
* // make sure to create following structure in your view.html file
|
||||
* // and add a height (for example 100%) to it, else the map won't be visible
|
||||
* // <ion-content>
|
||||
* // <div #map id="map" style="height:100%;"></div>
|
||||
* // </ion-content>
|
||||
* this.mapElement = document.getElementById('map');
|
||||
*
|
||||
* // create a new map by passing HTMLElement
|
||||
* let element: HTMLElement = document.getElementById('map');
|
||||
*
|
||||
* let map: GoogleMap = this.googleMaps.create(element);
|
||||
*
|
||||
* // listen to MAP_READY event
|
||||
* // You must wait for this event to fire before adding something to the map or modifying it in anyway
|
||||
* map.one(GoogleMapsEvent.MAP_READY).then(
|
||||
* () => {
|
||||
* console.log('Map is ready!');
|
||||
* // Now you can add elements to the map like the marker
|
||||
* }
|
||||
* );
|
||||
*
|
||||
* // create CameraPosition
|
||||
* let position: CameraPosition = {
|
||||
* let mapOptions: GoogleMapOptions = {
|
||||
* camera: {
|
||||
* target: {
|
||||
* lat: 43.0741904,
|
||||
* lng: -89.3809802
|
||||
* },
|
||||
* zoom: 18,
|
||||
* tilt: 30
|
||||
* }
|
||||
* };
|
||||
*
|
||||
* // move the map's camera to position
|
||||
* map.moveCamera(position);
|
||||
* this.map = this.googleMaps.create(this.mapElement, mapOptions);
|
||||
*
|
||||
* // create new marker
|
||||
* let markerOptions: MarkerOptions = {
|
||||
* position: ionic,
|
||||
* title: 'Ionic'
|
||||
* };
|
||||
* // Wait the MAP_READY before using any methods.
|
||||
* this.map.one(GoogleMapsEvent.MAP_READY)
|
||||
* .then(() => {
|
||||
* console.log('Map is ready!');
|
||||
*
|
||||
* // Now you can use all methods safely.
|
||||
* this.map.addMarker({
|
||||
* title: 'Ionic',
|
||||
* icon: 'blue',
|
||||
* animation: 'DROP',
|
||||
* position: {
|
||||
* lat: 43.0741904,
|
||||
* lng: -89.3809802
|
||||
* }
|
||||
* })
|
||||
* .then(marker => {
|
||||
* marker.on(GoogleMapsEvent.MARKER_CLICK)
|
||||
* .subscribe(() => {
|
||||
* alert('clicked');
|
||||
* });
|
||||
* });
|
||||
*
|
||||
* const marker: Marker = map.addMarker(markerOptions)
|
||||
* .then((marker: Marker) => {
|
||||
* marker.showInfoWindow();
|
||||
* });
|
||||
* }
|
||||
*
|
||||
* }
|
||||
*
|
||||
* ```
|
||||
* @classes
|
||||
* GoogleMap
|
||||
@ -442,6 +583,7 @@ export const GoogleMapsMapTypeId: { [mapType: string]: MapType; } = {
|
||||
* LatLng
|
||||
* LatLngBounds
|
||||
* Marker
|
||||
* MarkerCluster
|
||||
* Polygon
|
||||
* Polyline
|
||||
* Spherical
|
||||
@ -450,7 +592,6 @@ export const GoogleMapsMapTypeId: { [mapType: string]: MapType; } = {
|
||||
* BaseArrayClass
|
||||
* @interfaces
|
||||
* GoogleMapOptions
|
||||
* AnimateCameraOptions
|
||||
* CameraPosition
|
||||
* CircleOptions
|
||||
* GeocoderRequest
|
||||
@ -459,6 +600,8 @@ export const GoogleMapsMapTypeId: { [mapType: string]: MapType; } = {
|
||||
* ILatLng
|
||||
* MarkerIcon
|
||||
* MarkerOptions
|
||||
* MarkerClusterIcon
|
||||
* MarkerClusterOptions
|
||||
* MyLocation
|
||||
* MyLocationOptions
|
||||
* PolygonOptions
|
||||
@ -530,6 +673,99 @@ export class GoogleMaps extends IonicNativePlugin {
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
* https://github.com/mapsplugin/cordova-plugin-googlemaps-doc/blob/master/v2.0.0/class/BaseClass/README.md
|
||||
*/
|
||||
@Plugin({
|
||||
plugin: 'cordova-plugin-googlemaps',
|
||||
pluginName: 'GoogleMaps',
|
||||
pluginRef: 'plugin.google.maps.BaseClass',
|
||||
repo: ''
|
||||
})
|
||||
export class BaseClass {
|
||||
protected _objectInstance: any;
|
||||
|
||||
/**
|
||||
* Adds an event listener.
|
||||
*
|
||||
* @return {Observable<any>}
|
||||
*/
|
||||
@CordovaInstance({
|
||||
destruct: true,
|
||||
observable: true,
|
||||
clearFunction: 'removeEventListener',
|
||||
clearWithArgs: true
|
||||
})
|
||||
addEventListener(eventName: string): Observable<any> { return; }
|
||||
|
||||
/**
|
||||
* Adds an event listener that works once.
|
||||
*
|
||||
* @return {Promise<any>}
|
||||
*/
|
||||
@CordovaInstance({ destruct: true })
|
||||
addListenerOnce(eventName: string): Promise<any> { return; }
|
||||
|
||||
/**
|
||||
* Gets a value
|
||||
* @param key
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
get(key: string): any { return; }
|
||||
|
||||
/**
|
||||
* Sets a value
|
||||
* @param key
|
||||
* @param value
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
set(key: string, value: any, noNotify?: boolean): void { }
|
||||
|
||||
/**
|
||||
* Bind a key to another object
|
||||
* @param key {string}
|
||||
* @param target {any}
|
||||
* @param targetKey? {string}
|
||||
* @param noNotify? {boolean}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
bindTo(key: string, target: any, targetKey?: string, noNotify?: boolean): void { }
|
||||
|
||||
/**
|
||||
* Listen to a map event.
|
||||
*
|
||||
* @return {Observable<any>}
|
||||
*/
|
||||
@CordovaInstance({
|
||||
observable: true,
|
||||
destruct: true,
|
||||
clearFunction: 'off',
|
||||
clearWithArgs: true
|
||||
})
|
||||
on(eventName: string): Observable<any> { return; }
|
||||
|
||||
/**
|
||||
* Listen to a map event only once.
|
||||
*
|
||||
* @return {Promise<any>}
|
||||
*/
|
||||
@CordovaInstance({ destruct: true })
|
||||
one(eventName: string): Promise<any> { return; };
|
||||
|
||||
/**
|
||||
* Clears all stored values
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
empty(): void { }
|
||||
|
||||
/**
|
||||
* Dispatch event.
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
trigger(eventName: string, ...parameters: any[]): void {}
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
* https://github.com/mapsplugin/cordova-plugin-googlemaps-doc/blob/master/v2.0.0/class/BaseArrayClass/README.md
|
||||
@ -540,29 +776,17 @@ export class GoogleMaps extends IonicNativePlugin {
|
||||
pluginRef: 'plugin.google.maps.BaseArrayClass',
|
||||
repo: ''
|
||||
})
|
||||
export class BaseArrayClass<T> extends IonicNativePlugin {
|
||||
private _objectInstance: any;
|
||||
export class BaseArrayClass<T> extends BaseClass {
|
||||
|
||||
constructor(initialData: T[]) {
|
||||
constructor(initialData?: T[] | any) {
|
||||
super();
|
||||
if (checkAvailability(BaseArrayClass.getPluginRef(), null, BaseArrayClass.getPluginName()) === true) {
|
||||
this._objectInstance = new (BaseArrayClass.getPlugin())(initialData);
|
||||
if (initialData instanceof GoogleMaps.getPlugin().BaseArrayClass) {
|
||||
this._objectInstance = initialData;
|
||||
} else {
|
||||
this._objectInstance = GoogleMaps.getPlugin().BaseArrayClass(initialData);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Add an event listener
|
||||
* @param event {string} name of the event. Can be `insert_at`, `remove_at`, `set_at`, or `finish`.
|
||||
* @return {Observable<any>} returns an Observable
|
||||
*/
|
||||
@InstanceCheck({ observable: true })
|
||||
on(event: 'insert_at' | 'remove_at' | 'set_at' | 'finish') {
|
||||
return new Observable<any>((observer: Observer<any>) => {
|
||||
this._objectInstance.on(event, observer.next.bind(observer));
|
||||
return () => this._objectInstance.off(event, observer.next.bind(observer));
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Removes all elements from the array.
|
||||
* @param noNotify? {boolean} Set true to prevent remove_at events.
|
||||
@ -683,91 +907,6 @@ export class BaseArrayClass<T> extends IonicNativePlugin {
|
||||
setAt(index: number, element: T, noNotify?: boolean): void {}
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
* https://github.com/mapsplugin/cordova-plugin-googlemaps-doc/blob/master/v2.0.0/class/BaseClass/README.md
|
||||
*/
|
||||
export class BaseClass {
|
||||
protected _objectInstance: any;
|
||||
|
||||
/**
|
||||
* Adds an event listener.
|
||||
*
|
||||
* @return {Observable<any>}
|
||||
*/
|
||||
@InstanceCheck()
|
||||
addEventListener(eventName: string): Observable<any> {
|
||||
return Observable.fromEvent(this._objectInstance, eventName);
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds an event listener that works once.
|
||||
*
|
||||
* @return {Promise<any>}
|
||||
*/
|
||||
@InstanceCheck()
|
||||
addListenerOnce(eventName: string): Promise<any> {
|
||||
return new Promise<any>(resolve => this._objectInstance.addListenerOnce(eventName, resolve));
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets a value
|
||||
* @param key
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
get(key: string): any { return; }
|
||||
|
||||
/**
|
||||
* Sets a value
|
||||
* @param key
|
||||
* @param value
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
set(key: string, value: any): void { }
|
||||
|
||||
/**
|
||||
* Bind a key to another object
|
||||
* @param key {string}
|
||||
* @param target {any}
|
||||
* @param targetKey? {string}
|
||||
* @param noNotify? {boolean}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
bindTo(key: string, target: any, targetKey: string, noNotify: boolean): void { }
|
||||
|
||||
/**
|
||||
* Listen to a map event.
|
||||
*
|
||||
* @return {Observable<any>}
|
||||
*/
|
||||
@InstanceCheck({ observable: true })
|
||||
on(eventName: string): Observable<any> {
|
||||
return Observable.fromEvent(this._objectInstance, eventName);
|
||||
}
|
||||
|
||||
/**
|
||||
* Listen to a map event only once.
|
||||
*
|
||||
* @return {Promise<any>}
|
||||
*/
|
||||
@InstanceCheck()
|
||||
one(eventName: string): Promise<any> {
|
||||
return new Promise<any>(resolve => this._objectInstance.one(eventName, resolve));
|
||||
}
|
||||
|
||||
/**
|
||||
* Clears all stored values
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
empty(): void { }
|
||||
|
||||
/**
|
||||
* Dispatch event.
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
trigger(eventName: string, ...parameters: any[]): void {}
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
* https://github.com/mapsplugin/cordova-plugin-googlemaps-doc/blob/master/v2.0.0/class/Circle/README.md
|
||||
@ -954,10 +1093,46 @@ export class Geocoder {
|
||||
/**
|
||||
* Converts position to address and vice versa
|
||||
* @param {GeocoderRequest} request Request object with either an address or a position
|
||||
* @return {Promise<GeocoderResult | BaseArrayClass<GeocoderResult>>}
|
||||
* @return {Promise<GeocoderResult[] | BaseArrayClass<GeocoderResult>>}
|
||||
*/
|
||||
@Cordova()
|
||||
geocode(request: GeocoderRequest): Promise<GeocoderResult | BaseArrayClass<GeocoderResult>> { return; }
|
||||
geocode(request: GeocoderRequest): Promise<GeocoderResult[] | BaseArrayClass<GeocoderResult>> {
|
||||
|
||||
if (request.address instanceof Array || Array.isArray(request.address) ||
|
||||
request.position instanceof Array || Array.isArray(request.position)) {
|
||||
// -------------------------
|
||||
// Geocoder.geocode({
|
||||
// address: [
|
||||
// "Kyoto, Japan",
|
||||
// "Tokyo, Japan"
|
||||
// ]
|
||||
// })
|
||||
// -------------------------
|
||||
return new Promise<BaseArrayClass<GeocoderResult>>((resolve, reject) => {
|
||||
GoogleMaps.getPlugin().Geocoder.geocode(request, (mvcArray: any) => {
|
||||
if (mvcArray) {
|
||||
resolve(new BaseArrayClass(mvcArray));
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
// -------------------------
|
||||
// Geocoder.geocode({
|
||||
// address: "Kyoto, Japan"
|
||||
// })
|
||||
// -------------------------
|
||||
return new Promise<GeocoderResult[]>((resolve, reject) => {
|
||||
GoogleMaps.getPlugin().Geocoder.geocode(request, (results: GeocoderResult[]) => {
|
||||
if (results) {
|
||||
resolve(results);
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
@ -1094,7 +1269,7 @@ export class GoogleMap extends BaseClass {
|
||||
* @param domNode
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
setDiv(domNode: HTMLElement): void { }
|
||||
setDiv(domNode?: HTMLElement): void { }
|
||||
|
||||
/**
|
||||
* Returns the map HTML element
|
||||
@ -1115,7 +1290,7 @@ export class GoogleMap extends BaseClass {
|
||||
* @return {Promise<any>}
|
||||
*/
|
||||
@CordovaInstance()
|
||||
animateCamera(animateCameraOptions: AnimateCameraOptions): Promise<any> { return; }
|
||||
animateCamera(cameraPosition: CameraPosition<any>): Promise<any> { return; }
|
||||
|
||||
/**
|
||||
* Zooming in the camera with animation
|
||||
@ -1136,7 +1311,7 @@ export class GoogleMap extends BaseClass {
|
||||
* @return {Promise<any>}
|
||||
*/
|
||||
@CordovaInstance()
|
||||
moveCamera(cameraPosition: CameraPosition): Promise<any> { return; }
|
||||
moveCamera(cameraPosition: CameraPosition<any>): Promise<any> { return; }
|
||||
|
||||
/**
|
||||
* Zooming in the camera without animation
|
||||
@ -1157,14 +1332,14 @@ export class GoogleMap extends BaseClass {
|
||||
* @return {CameraPosition}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
getCameraPosition(): CameraPosition { return; }
|
||||
getCameraPosition(): CameraPosition<ILatLng> { return; }
|
||||
|
||||
/**
|
||||
* Get the current camera target position
|
||||
* @return {Promise<CameraPosition>}
|
||||
*/
|
||||
@CordovaInstance()
|
||||
getCameraTarget(): Promise<CameraPosition> { return; }
|
||||
@CordovaInstance({ sync: true })
|
||||
getCameraTarget(): ILatLng { return; }
|
||||
|
||||
/**
|
||||
* Get the current camera zoom level
|
||||
@ -1254,7 +1429,7 @@ export class GoogleMap extends BaseClass {
|
||||
* Remove all overlays, such as marker
|
||||
* @return {Promise<any>}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
@CordovaInstance()
|
||||
clear(): Promise<any> { return; }
|
||||
|
||||
/**
|
||||
@ -1262,7 +1437,7 @@ export class GoogleMap extends BaseClass {
|
||||
* @return {Promise<any>}
|
||||
*/
|
||||
@CordovaInstance()
|
||||
fromLatLngToPoint(latLng: ILatLng): Promise<any> { return; }
|
||||
fromLatLngToPoint(latLng: ILatLng): Promise<any[]> { return; }
|
||||
|
||||
/**
|
||||
* Convert the unit from the pixels from the left/top to the LatLng
|
||||
@ -1354,6 +1529,19 @@ export class GoogleMap extends BaseClass {
|
||||
});
|
||||
}
|
||||
|
||||
@InstanceCheck()
|
||||
addMarkerCluster(options: MarkerClusterOptions): Promise<MarkerCluster | any> {
|
||||
return new Promise<MarkerCluster>((resolve, reject) => {
|
||||
this._objectInstance.addMarkerCluster(options, (markerCluster: any) => {
|
||||
if (markerCluster) {
|
||||
resolve(new MarkerCluster(this, markerCluster));
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds a circle
|
||||
* @return {Promise<Circle | any>}
|
||||
@ -1580,12 +1768,19 @@ export class GroundOverlay extends BaseClass {
|
||||
/**
|
||||
* @hidden
|
||||
*/
|
||||
export class HtmlInfoWindow extends BaseClass {
|
||||
@Plugin({
|
||||
plugin: 'cordova-plugin-googlemaps',
|
||||
pluginName: 'GoogleMaps',
|
||||
pluginRef: 'plugin.google.maps.HtmlInfoWindow',
|
||||
repo: ''
|
||||
})
|
||||
export class HtmlInfoWindow<T> extends IonicNativePlugin {
|
||||
private _objectInstance: any;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
if (checkAvailability(GoogleMaps.getPluginRef(), null, GoogleMaps.getPluginName()) === true) {
|
||||
this._objectInstance = new (GoogleMaps.getPlugin()).HtmlInfoWindow();
|
||||
if (checkAvailability(HtmlInfoWindow.getPluginRef(), null, HtmlInfoWindow.getPluginName()) === true) {
|
||||
this._objectInstance = new (HtmlInfoWindow.getPlugin())();
|
||||
}
|
||||
}
|
||||
|
||||
@ -1618,85 +1813,6 @@ export class HtmlInfoWindow extends BaseClass {
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
*/
|
||||
export class LatLng implements ILatLng {
|
||||
|
||||
lat: number;
|
||||
lng: number;
|
||||
|
||||
constructor(lat: number, lng: number) {
|
||||
this.lat = lat;
|
||||
this.lng = lng;
|
||||
}
|
||||
|
||||
equals(other: ILatLng): boolean {
|
||||
return this.lat === other.lat && this.lng === other.lng;
|
||||
}
|
||||
|
||||
toString(): string {
|
||||
return this.lat + ',' + this.lng;
|
||||
}
|
||||
|
||||
toUrlValue(precision?: number): string {
|
||||
precision = precision || 6;
|
||||
|
||||
return this.lat.toFixed(precision) + ',' + this.lng.toFixed(precision);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
*/
|
||||
export class LatLngBounds {
|
||||
private _objectInstance: any;
|
||||
|
||||
@InstanceProperty northeast: LatLng;
|
||||
@InstanceProperty southwest: LatLng;
|
||||
@InstanceProperty type: string;
|
||||
|
||||
constructor(southwestOrArrayOfLatLng: LatLng | LatLng[], northeast?: LatLng) {
|
||||
let args = !!northeast ? [southwestOrArrayOfLatLng, northeast] : southwestOrArrayOfLatLng;
|
||||
this._objectInstance = new (GoogleMaps.getPlugin()).LatLngBounds(args);
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts to string
|
||||
* @return {string}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
toString(): string { return; }
|
||||
|
||||
/**
|
||||
* Returns a string of the form "lat_sw,lng_sw,lat_ne,lng_ne" for this bounds, where "sw" corresponds to the southwest corner of the bounding box, while "ne" corresponds to the northeast corner of that box.
|
||||
* @param precision {number}
|
||||
* @return {string}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
toUrlValue(precision?: number): string { return; }
|
||||
|
||||
/**
|
||||
* Extends this bounds to contain the given point.
|
||||
* @param LatLng {ILatLng}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
extend(LatLng: ILatLng): void {}
|
||||
|
||||
/**
|
||||
* Returns true if the given lat/lng is in this bounds.
|
||||
* @param LatLng {ILatLng}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
contains(LatLng: ILatLng): boolean { return; }
|
||||
|
||||
/**
|
||||
* Computes the center of this LatLngBounds
|
||||
* @return {LatLng}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
getCenter(): LatLng { return; }
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
@ -1711,6 +1827,13 @@ export class Marker extends BaseClass {
|
||||
this._objectInstance = _objectInstance;
|
||||
}
|
||||
|
||||
/**
|
||||
* Return the ID of instance.
|
||||
* @return {string}
|
||||
*/
|
||||
@CordovaInstance({ sync: true })
|
||||
getId(): number { return; }
|
||||
|
||||
/**
|
||||
* Return the map instance.
|
||||
* @return {GoogleMap}
|
||||
@ -1906,6 +2029,30 @@ export class Marker extends BaseClass {
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
*/
|
||||
export class MarkerCluster extends BaseClass {
|
||||
|
||||
private _map: GoogleMap;
|
||||
|
||||
constructor(_map: GoogleMap, _objectInstance: any) {
|
||||
super();
|
||||
this._map = _map;
|
||||
this._objectInstance = _objectInstance;
|
||||
}
|
||||
|
||||
@CordovaInstance({ sync: true })
|
||||
addMarker(marker: MarkerOptions): void {}
|
||||
|
||||
@CordovaInstance({ sync: true })
|
||||
addMarkers(markers: MarkerOptions[]): void {}
|
||||
|
||||
@CordovaInstance({ sync: true })
|
||||
remove(): void {}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @hidden
|
||||
*/
|
||||
|
||||
Loading…
Reference in New Issue
Block a user