ngMap - 如何使用数组绘制多边形

时间:2015-09-28 09:19:02

标签: angularjs ng-map

我正在尝试使用http://ngmap.github.io/绘制多边形。如果我使用以下代码,它可以完美地运行:

    <map center="<% latitude %>, <% longitude %>" zoom="2">
        <marker 
            ng-repeat="marker in GoogleMap.markers" 
            on-click="showInfoWindow(event, marker)" 
            icon="/images/<% marker.icon %>" 
            position="<% marker.latitude %>, <% marker.longitude %>"
        >
        </marker>
        <shape
            paths="[[25.774252, -80.190262],[18.466465, -66.118292],[32.321384, -64.75737],[25.774252, -80.190262]]"
            name="polygon"
            stroke-color="#FF0000" 
            stroke-opacity="0.8" 
            stroke-weight="2" 
            fill-color="#FF0000" 
            fill-opacity="0.35"
        >
        </shape>
    </map>

但是,如果我将多边形坐标分配给控制器内的范围变量,它会以“非数组”崩溃,如下所示

    <map center="<% latitude %>, <% longitude %>" zoom="2">
        <marker 
            ng-repeat="marker in GoogleMap.markers" 
            on-click="showInfoWindow(event, marker)" 
            icon="/images/<% marker.icon %>" 
            position="<% marker.latitude %>, <% marker.longitude %>"
        >
        </marker>
        <shape
            paths="polgon"
            name="polygon"
            stroke-color="#FF0000" 
            stroke-opacity="0.8" 
            stroke-weight="2" 
            fill-color="#FF0000" 
            fill-opacity="0.35"
        >
        </shape>
    </map>

...其中多边形在我的控制器中定义为

$scope.polygon = [[25.774252, -80.190262],[18.466465, -66.118292],[32.321384, -64.75737],[25.774252, -80.190262]];

我错过了一些明显的东西吗?任何帮助表示赞赏。

1 个答案:

答案 0 :(得分:0)

问题是路径的值是“多边形”字符串,而不是数组。

通过添加花括号解决了这个问题。