Javascript 使用angular js向google地图动态添加圆或多边形

我需要添加不同的形状，如圆形和多边形动态谷歌地图使用angularjs。 例如： 假设我在文本框中输入lat和long以及其他选项，如fillColor和radius，然后单击generate，这个圆应该在谷歌地图上生成。 我正在使用谷歌地图指令生成地图。 我可以用这个生成圆

<ui-gmap-marker coords="marker.coords" options="marker.options" idkey="marker.id">
</ui-gmap-marker>
<ui-gmap-circle ng-repeat="c in circles track by c.id" center="c.center" stroke="c.stroke" fill="c.fill" radius="c.radius" visible="c.visible" geodesic="c.geodesic" editable="c.editable" draggable="c.draggable" clickable="c.clickable" control="c.control"> </ui-gmap-circle>

---

但是我需要动态地生成它，比如这样的

有一个更容易理解和使用的AngularJS Google MAP指令，它是由Stackoverflow的一个成员创建的。请找到它。

使用此指令，您可以执行以下操作：

它易于理解，并且可以在您的用户界面代码中轻松管理。

希望这有助于

样品溶液：

---

在谷歌地图中动态改变形状和坐标的解决方案。它基于上面提到的API。

经过一番研究和帮助，我终于找到了解决方案。 我使用了简单的函数来改变形状

$scope.chooseShape = function(shape) {
   $scope.shapeShow = shape;
return

如果我正在显示

<ui-gmap-circle ng-repeat="c in circles track by c.id" center="c.center" ng-if="shapeShow=='CIRCLE'"></ui-gmap-circle>              
<ui-gmap-drawing-manager options="drawingManagerOptions" control="drawingManagerControl" ng-if="shapeShow == 'POLYGON'"></ui-gmap-drawing-manager>

---

最后，在这些圆和多边形上使用ng repeat显示用户可以添加的形状数。

请告诉我Benison的另一件事。如何动态添加形状？如果我在DOM中附加HTML，那么它将不起作用。我不想在创建圆圈时刷新地图，如果您更改代码（即控制器）中的值，它应该可以工作。敬请期待。拿出一个示例代码。很高兴，我可以帮忙。Sushant，你可以在这里发布你的答案，一些指针和部分代码，展示你是如何通过代码解决这个问题的。帮助我和其他需要相同问题提示的开发人员。。。

<ui-gmap-circle ng-repeat="c in circles track by c.id" center="c.center" ng-if="shapeShow=='CIRCLE'"></ui-gmap-circle>              
<ui-gmap-drawing-manager options="drawingManagerOptions" control="drawingManagerControl" ng-if="shapeShow == 'POLYGON'"></ui-gmap-drawing-manager>