angularjs-google-maps Info window position

Question

I work with angularjs-google-maps and I used this example for my application. In the controller at vm.shops if I change the:

vm.shops = [
    {id:'1', name: 'FOO SHOP', position:[41,-87]},
    {id:'2', name: 'BAR SHOP', position:[42,-86]}
];

To:

vm.shops = [
    {id:1, name: 'FOO SHOP', position:[41,-87]},
    {id:2, name: 'BAR SHOP', position:[42,-86]}
];

So the id number is without '' the info Window appears for all markers in the same position and this position is not above each marker.

Answer 1

showInfoWindow is expecting a string, so you can use toString() on shop.id:

  vm.showDetail = function(e, shop) {
    vm.shop = shop;
    vm.map.showInfoWindow('foo-iw', shop.id.toString());
  };

Updated Demo

Answer 2

You can parse to string your shop IDs in the showDetail function:

vm.map.showInfoWindow('foo-iw', shop.id + '');

Forked Plunker