我使用ngmap和角JS来显示地图，而问题的一组标记。我需要油漆加入这些标记线。

我的code：

在视图：

\r\r

\r\r\r

在我的控制器：

\r\r

\r\r\r

为了这个目的，你可以使用形状指令，例如：

 ＆LT;形状NAME =折线路径={{路径}}测=真正的行程彩色=＃FF0000中风不透明度=1.0行程-weight =2＆GT;＆下; /形状与GT; 

其中，路径属性从标记初始化是这样的：

  $ scope.path = $ scope.markers.map（函数（标记）{    返回[marker.lat，marker.lng]}）; 

工作实例

\r\r

\r

\r\r\r

Plunker

I am using ngmap and angular js to show a set of markers in a map without problem. I need paint a line that join these markers.

My code:

In view:

 <map center="{{markers[0].lat}},{{markers[0].lng}}" zoom="12">
   <marker ng-repeat="pos in markers" position="{{pos.lat}}, {{pos.lng}}"></marker>
</map>

in my controller:

var app = angular.module('Items', ['ngMap'])

app.controller('CICtrl', function($scope){
    $scope.markers = [{id:1, lat:37.772323, lng: -122.214897}, {id:2, lat:21.291982, lng: -157.821856}, {id:3, lat:-27.46758, lng: 153.027892}];
});

For that purpose you could utilize shape directive, for example:

<shape name="polyline" path="{{path}}" geodesic="true" stroke-color="#FF0000" stroke-opacity="1.0" stroke-weight="2"></shape>

where path property is initialized from markers like this:

$scope.path = $scope.markers.map(function(marker){
    return [marker.lat,marker.lng];
});

Working example

var app = angular.module('appMaps', ['ngMap']);
app.controller('mainCtrl', function ($scope) {
    $scope.markers = [{ id: 1, lat: 37.772323, lng: -122.214897 }, { id: 2, lat: 21.291982, lng: -157.821856 }, { id: 3, lat: -27.46758, lng: 153.027892 }];
    $scope.path = $scope.markers.map(function(marker){
        return [marker.lat,marker.lng];
    });
});

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=weather,visualization,panoramio"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="https://rawgit.com/allenhwkim/angularjs-google-maps/master/build/scripts/ng-map.js"></script>
<div id="map_canvas" ng-app="appMaps" ng-controller="mainCtrl" >
        <map center="{{markers[0].lat}},{{markers[0].lng}}" zoom="5">
            <marker ng-repeat="pos in markers" position="{{pos.lat}}, {{pos.lng}}"></marker>
            <shape name="polyline" path="{{path}}" geodesic="true" stroke-color="#FF0000" stroke-opacity="1.0" stroke-weight="2">
            </shape>
        </map>
</div>

Plunker