ui-gmap-markers is not working

Question

im trying to put some markers in a map using the angular-google-maps library, i can draw one marker using ui-gmap-marker but not many markers using ui-gmap-markers. Here is my js code.

angular.module('myApp').controller('homeController', [homeController]);

function homeController(){
    var vm = this;

    vm.map = {
        center:{
            latitude: 46.8032826,
            longitude: -71.242796
        },
        zoom: 12
    };

    vm.places = [
                 {
                   idKey: 583187,
                   latitude: 46.7682,
                   longitude: -71.3234,
                   title: "title"
                 }
               ];
};

the html :

<ion-view ng-controller="homeController as vm">
<ui-gmap-google-map draggable="true" center="vm.map.center" zoom="vm.map.zoom">
    <ui-gmap-markers models="vm.places" coords="'self'" icon="'icon'"></ui-gmap-markers>
</ui-gmap-google-map>
</ion-view>

I can see the map, with a console.log i can see that the places array is correctly set, but i see no markers at all ! what is wrong with my code ?

Thank you.

PS: notice im using ionic, im sur it has nothing to do with the problem.

Answer 1

Either change your idKey to id, or specify <ui-gmap-markers models="vm.places" coords="'self'" icon="'icon'" idKey="'idKey'"></ui-gmap-markers>