Question

我需要一条路径连接几个位置，箭头标记在我的标记处。

目前我正在绘制折线，但它没有显示指示方向的箭头。

HTML：

<ui-gmap-google-map center='routeMap.center' zoom='routeMap.zoom' events="routeMap.events" refresh="refreshMap" control="routeMap.control">
    <ui-gmap-marker ng-repeat="activity in activityFeed" idKey="activity.id" coords="activity.coordinates" events="routeMap.markersEvents"  control="routeMap.markersControl">
        <ui-gmap-polylines models="markers" stroke="stroke" path="markers" events="routeMap.markersEvents"></ui-gmap-polylines>
    </ui-gmap-marker>
</ui-gmap-google-map>

markers数组包含纬度字典，经度键。

我认为使用当前库的折线是不可能的。但我相信必须有一些解决方法。

由于

Answer 1

在折线配置中指定：

HTML：

<ui-gmap-polyline 
ng-repeat="p in map.polylines" 
path="p.path" 
stroke="p.stroke" 
visible='p.visible' 
geodesic='p.geodesic' 
fit="false" 
editable="p.editable" 
draggable="p.draggable" 
icons='p.icons'>
</ui-gmap-polyline>

JS：

  $scope.map.polylines = [
            {
              id: 1,
              path: [
              ],
              stroke: {
                color: '#04B0FF',
                weight: 2
              },
              editable: false,
              draggable: false,
              geodesic: true,
              visible: true,
              icons: [
                {
                  icon: {
                    path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW
                  },
                  offset: '25px',
                  repeat: '50px'
                }
              ]
            }
    ]

您也可以参考此Demo

角度谷歌地图折线与方向箭头标记

1 个答案: