google maps: The map is never displayed

[luisbahamonde]

The map is never displayed nor does it give any error. The div where it loads becomes transparent since I have initially set black background and a second later when loading the function it loses the black color but it stays red border (Show my code). It seems all correct because the map is ready function is displayed.

map.ts
`

ionViewDidEnter() {
console.log('entra en la vista');

setTimeout(() => {

  this.loadMap();

}, 1000);

}

loadMap(){

let element: HTMLElement = document.getElementById('map');
let map: GoogleMap = this.googleMaps.create(element);

map.one(GoogleMapsEvent.MAP_READY).then(() => {
  console.log('Map is ready!');
});

map.setDebuggable(true);

}

}
`

map.html
`

`

My system information:

Cordova CLI: 6.5.0
Ionic Framework Version: 3.0.1
Ionic CLI Version: 2.2.2
Ionic App Lib Version: 2.2.1
Ionic App Scripts Version: 1.3.1
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: macOS Sierra
Node Version: v4.4.2
Xcode version: Xcode 8.3.2 Build version 8E2002

[ihadeed]

Does this fix your issue ionic-team/ionic-framework#7205 (comment) ?