angularjs - ng-地图。形状内的文字？

Question

有谁知道是否可以在带有 ng-map 的形状内包含文本。

<ng-map default-style="true" zoom="18" center="53.25564575, -113.81401062" map-type-id="SATELLITE">
  <shape name="rectangle"
    editable="true"
    draggable="true"
    bounds="[[53.2559199723254, -113.81282455825806],[53.25598021665402, -113.81252316761015 ]]"
    on-bounds_changed="vm.boundsChanged()"
    stroke-color="#333"
   stroke-opacity="0.9"
   stroke-weight="2"
   fill-color="#FF0000"
   fill-opacity="0.8"
    >
  </shape>
</ng-map>

有什么想法吗？

Answer 1

这就是我解决这个问题的方法：

首先，我通常添加了我的形状：

<shape ng-repeat="zone in mapViewCtrl.displayedZones" name="polygon" fill-color="{{zone.hexColor}}" stroke-color="{{zone.hexColor}}" stroke-opacity="{{zone.fillColor.a/100}}" stroke-weight="2" paths="{{zone.paths}}"></shape>'

然后计算点的平均值，以获得中心周围的点：

getAveragePoint(points) {
    var x = 0;
    var y = 0;
    let n = points.length;
    for (let point of points) {
        x += point[0];
        y += point[1];
    }
    return [x / n, y / n];
}

然后我在中心点添加了一个自定义标记来显示我的文本：

<custom-marker ng-repeat="zone in mapViewCtrl.displayedZones" position="{{zone.center}}"><div class="zone-title"><b>{{zone.name}}</b></div></custom-marker>

我希望这有帮助