Hello guys, I have this code :
import {
GoogleMaps,
GoogleMap,
GoogleMapsEvent,
GoogleMapOptions,
CameraPosition,
MarkerOptions,
Marker,
Environment
} from '@ionic-native/google-maps';
import { Platform } from '@ionic/angular';
export class MapComponent implements OnInit, AfterViewInit {
map: GoogleMap;
constructor(
private platform: Platform
) {
this.platform.ready().then(() => {
console.log('Constructor');
this.loadMap();
});
}
loadMap() {
// This code is necessary for browser
Environment.setEnv({
API_KEY_FOR_BROWSER_RELEASE: 'API_SECRET',
API_KEY_FOR_BROWSER_DEBUG: 'API_SECRET'
});
const mapOptions: GoogleMapOptions = {
camera: {
target: {
lat: 43.0741904,
lng: -89.3809802
},
zoom: 18,
tilt: 30
}
};
this.map = GoogleMaps.create('map_canvas', mapOptions);
console.log('load 4');
const marker: Marker = this.map.addMarkerSync({
title: 'Ionic',
icon: 'blue',
animation: 'DROP',
position: {
lat: 43.0741904,
lng: -89.3809802
}
});
marker.on(GoogleMapsEvent.MARKER_CLICK).subscribe(() => {
alert('clicked');
});
}
In html I have :
<ion-content>
<div id="map_canvas"></div>
</ion-content>
I have the error :
ncaught (in promise): TypeError: GoogleMaps.getPlugin(…) is null
./node_modules/@ionic-native/google-maps/index.js/Environment.setEnv@http://187.2.0.2:8100 /vendor.js:100276:20
I use this lib : https://github.com/ionic-team/ionic-native-google-maps/blob/d7898d7a58940a9eb478ee4a1ef5d3d431db9e25/documents/README.md
I found some answers on stackoverflow but didn’t help me. Thx in advance.
You can find all the content of component.