2017-05-05 3 views
1

私のアプリケーションではngmapを使用しています。私はshapeを使ってその座標から多角形を表示することができました。今、私はこのポリゴンを編集可能にしたいと思います。私はこのlinkを参照し、私のポリゴンは現在編集可能です。問題は、どうやって新しい座標を得ることができないのかということです。編集した図形の新しい座標を取得し、中心を動的に計算する方法

drawing-manageronMapOverlayCompletedというイベントがありますか?

どうすれば新しい座標を取得できますか?

また、どのように私は動的に

+0

をあなたのような同じ問題ですが、別の方法を使用して。試してみたいのであれば、[JSFiddle](https://jsfiddle.net/xvbLr993/14/)があります。任意の種類の図形を動的に描画できます。希望することができます:) –

答えて

0

center属性の値を計算することができますそれはあなたがbounds_changedイベントを利用することができるリサイズ境界を決定するためにRectangleの場合には、形状の種類によって異なります。次の例では、矩形のリサイズサイズに印刷する方法を示しています。ここでは

var app = angular.module('myapp', ['ngMap']); 
 
app.controller('DrawingManagerCtrl', function (NgMap) { 
 
    var vm = this; 
 
    
 
    NgMap.getMap().then(function (map) { 
 
      vm.map = map; 
 
    }); 
 

 
    
 

 
    vm.rectShapeResized = function (e) { 
 
     var rect = vm.map.shapes[0]; //get the first instance of shape 
 
     console.log(rect.getBounds().toString()); //print a new bounds 
 
    }; 
 
});
<script src="https://maps.google.com/maps/api/js?libraries=placeses,visualization,drawing,geometry,places"></script> 
 
<script src="https://code.angularjs.org/1.3.15/angular.js"></script> 
 
<script src="https://rawgit.com/allenhwkim/angularjs-google-maps/master/build/scripts/ng-map.js"></script> 
 

 

 
<div ng-app="myapp" ng-controller="DrawingManagerCtrl as vm"> 
 
    <ng-map zoom="7" center="48.8588377,2.2775177" map-type-id="ROADMAP" street-view-control-options="{position: 'LEFT_CENTER'}"> 
 
     
 
     <shape name="rectangle" 
 
      editable="true" on-bounds_changed="vm.rectShapeResized()" 
 
      bounds="[ [48.190, 2.649], [48.899, 3.443] ]"> 
 
      </shape> 
 
    </ng-map> 
 
</div>

+1

あなたはこれを確認してくださいhttp://stackoverflow.com/questions/43942610/ngmap-cluster-change-markers-colors-after-zoom –

関連する問題