Why are my map marker windows not showing?


In my Ionic App, I’m using Angular Google Maps to display a marker for my current location and a slew of others for points of interest.

I have the markers displaying fine, however, for the life of me I can’t get the ui-gmap-windows to show.

From the documentation and examples I have come across, I seem to be doing everything right, however I can’t for the life of me see why the markers are not displaying.

I’m not getting any errors appearing in the console.

Once I have the windows showing, I’d like them to show and hide when you click on the marker.

Here’s my template:

<ion-view view-title="Harbour Map">
    <ui-gmap-google-map center='map.center' zoom='map.zoom' aria-label="Google map">
        <ui-gmap-marker coords="coords" idkey="999999"></ui-gmap-marker>
        <ui-gmap-markers models="harbours" coords="'self'" icon="'icon'" idkey="id">

And my controller:

.controller('MapCtrl', function($scope, Harbours) {
  $scope.position = 'Trying to find your location...'
  $scope.coords = {};
  if (navigator.geolocation){
        $scope.position = position.coords.latitude+", "+position.coords.longitude;
        $scope.coords.longitude = position.coords.longitude;
        $scope.coords.latitude = position.coords.latitude;
  } else {
    $scope.position = "Sorry, we can't get your location";

  var harboursPromise = Harbours.all();

    console.log('response from controller', response);
    $scope.map = { center: { latitude: 39.624984, longitude: 19.922346 }, zoom: 10 };
    $scope.harbours = [];
    $scope.harbours = response.harbours;  

The Harbours factory returns a json array of harbours like so:

"id": 1,
"name": "Harbour 1",
"latitude": 39.790814,
"longitude": 19.922869
}, {
"id": 2,
"name": "Harbour 2",
"latitude": 39.789155,
"longitude": 19.916518,


Can you post:

  • the output from ionic info:

Your system information:

Cordova CLI: 5.1.1
Gulp version: CLI version 3.9.0
Gulp local: Local version 3.9.0
Ionic CLI Version: 1.6.1
Ionic App Lib Version: 0.3.3
ios-deploy version: 1.7.0
ios-sim version: 3.1.1
OS: Mac OS X Yosemite
Node Version: v0.12.5
Xcode version: Xcode 6.4 Build version 6E35b



My system info is:

Your system information:

Cordova CLI: 5.3.1
Gulp version: CLI version 3.9.0
Gulp local: Local version 3.9.0
Ionic Version: 1.1.0
Ionic CLI Version: 1.6.4
Ionic App Lib Version: 0.3.8
ios-deploy version: Not installed
ios-sim version: 4.1.1
OS: Mac OS X Yosemite
Node Version: v0.12.4
Xcode version: Xcode 7.0 Build version 7A220

Thank you