Ionic2 + native google maps

I am trying to integrate google maps into my application and I have taken code from the ionic2 website, however, getting this error:

Uncaught in promise: [object, Object]

My .ts file

import { Component } from '@angular/core';
import { Page } from 'ionic/ionic';
import { NavController } from 'ionic-angular';
import {
} from 'ionic-native';

  selector: 'page-home',
  templateUrl: 'home.html'
export class HomePage {


  constructor(public navCtrl: NavController) {


  ngAfterViewInit() {

    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>

   // create a new map by passing HTMLElement
   let element: HTMLElement = document.getElementById('map');

   let map = new GoogleMap(element);

   // listen to MAP_READY event => console.log('Map is ready!'));

   // create LatLng object
   let ionic: GoogleMapsLatLng = new GoogleMapsLatLng(43.0741904,-89.3809802);

   // create CameraPosition
   let position: CameraPosition = {
     target: ionic,
     zoom: 18,
     tilt: 30

   // move the map's camera to position

   // create new marker
   let markerOptions: GoogleMapsMarkerOptions = {
     position: ionic,
     title: 'Ionic'

     .then((marker: GoogleMapsMarker) => {

and my .html file


  <div #map id="map" style="height:100%;"></div>

I am really struggling and can’t really understand why it is not working. I have set up the keys and installed the plugin. (followed the tutorial from:

Hi @vikneke :slight_smile:

If you are trying to implement Google maps javascript API’s refer these links, hope it might be helpful


He is running the native plugin accordingly with the sample shown on Ionic docs, and I have the same issue. Can’t figure out why at the moment but I will get into it and found a solution.

Don’t forget Ionic 2 is still new and a few bugs can appear so we just have to be patient with it, anyway if someone already found a solution for it don’t hesitate to share

I ended up using javascript api instead, which is not native but works!

i am using the same code, the only difference is I have a promise chain returns a promise and so does

Can you share the code? I have the same issue, I want to add static markers on a map and have it zoomed in my city