2014-11-16 2 views
0

Я пытаюсь отобразить несколько маркеров на карте, используя библиотеку ui-google-maps для углового отображения, но отображает только один маркер.ui-gmap-маркеры, показывающие только один маркер

<div id="map_canvas" ng-controller="mainCtrl"> 
<h1 align="center">Maps</h1> 
<ui-gmap-google-map center="map.center" zoom="map.zoom" draggable="true" options="options"> 
<ui-gmap-markers models="rmarkers" coords="'self'" fit='true' icon="'icon'"> 
</ui-map-markers> 
</ui-gmap-google-map> 
</div> 

<script> 
angular.module('main', ['google-maps'.ns()]) 
.controller('mainCtrl', function($scope,$http) { 
    $scope.map = {center: {latitude: 42.3349940452867, longitude: -71.0353168884369 }, zoom: 14 }; 
    //$scope.marker={id: 1, coords: {latitude: 42.3349940452867, longitude: -71.0353168884369 }}; 
    $scope.options = {scrollwheel: false}; 
    $scope.rmarkers=[{id: 101, latitude: 42.3349940452867, longitude: -71.0353168884369}, 
      {id: 102,latitide: 42.35114190333,longitude: -71.0662789402048}, 
      {id: 103,latitide: 43.35114190333,longitude: -72.0662789402048}, 
      {id: 104,latitide: 44.35114190333,longitude: -73.0662789402048}];}); 
+0

Я заметил начальный тег , либо начальный тег, либо закрывающий тег

ответ

0

если под щ-Google-картах библиотеки для углового 'вы имеете в виду https://github.com/angular-ui/angular-google-maps

то это показывает несколько маркеров на карте, адаптируя купол вашего кода, чтобы показать, работает в скрипку http://jsfiddle.net/nigeljvm/duabubeo/9/

HTML слой

<div ng-app="main" ng-controller="mainCtrl"> <ui-gmap-google-map center="map.center" zoom="map.zoom" draggable="true"> <ui-gmap-marker ng-repeat="m in map.markersr" coords="m" icon="m.icon" idkey="m.id"> </ui-gmap-marker> </ui-gmap-google-map> </div>

javascript layer

angular.module('main', ['uiGmapgoogle-maps']) 
.controller('mainCtrl', function ($scope) { 

angular.extend($scope, { 
    map: { 
     center: { 
      latitude: 42.3349940452867, 
      longitude:-71.0353168884369 
     }, 
     zoom: 11, 
     markersr: [ 
     { 
      id: 101, 
      latitude: 42.3349940452867, 
      longitude:-71.0363168884369 
     },  
     { 
      id: 102, 
      latitude: 42.3563941755867, 
        longitude:-71.0466168884469 
     }, { 
      id: 103, 
      latitude: 42.3753940755867, 
        longitude:-71.0853168884369 
     }, { 
      id: 104, 
      latitude: 42.3684940856867, 
       longitude:-71.1273168884369 
     }], 
     dynamicMarkers: [] 
    } 
}); 

});

CSS .angular-google-map-container { height: 400px; }

на основе источника углового Ui https://github.com/angular-ui/angular-google-maps/blob/master/example/assets/scripts/controllers/issue-74-markers-events.js

0

У вас есть опечатка. Замените «Latitide» на «широту»

Смежные вопросы