在Sebm Google地图中的DragEnd时如何获取多边形的路径？角2 [英] How to get paths of polygon when DragEnd in Sebm Google Maps? Angular 2

问题描述

每当我编辑新的多边形时，无论是通过dragend还是点击，我都会得到变量的初始路径。

我初始化我的路径变量为：

  paths：Array< LatLngLiteral> = [{lat：-12.052224，lng：-77.050342}，{lat：-12.064306，lng：-77.031790}，{lat：-12.075951，lng：-77.054554}，{lat：-12.063236，lng：-77.072506}， {lat：-12.052224，lng：-77.050342}]; 
  

不管更新路径变量，无论我做什么。

我失败了？为什么我无法获得最终的多边形及其各自的路径并始终得到最初的多边形？或者什么是正确的方法来获得新的多边形？

这是我的组件：

 < sebm-google-map [latitude] =lat[longitude] =lng[zoom] =zoom> 
 < / sebm-map-polygon> 
< / sebm-google-map> 
  

解决方案

晚了，但我认为像我这样的人可能会得到一些帮助所以添加了答案。

当前版本不支持它，因此您需要对当前的node_module进行一些更改。看到这个网址：

https://github.com/SebastianM/angular-google-maps/pull/991

willshowell解释了需要完成的工作。

步骤：

1. 将sebm更新为agm（截至目前的版本）


2. 其次，更新您的角度至少为2.3，因为它不适用于2.0。


3. 在上面的链接中，他已经向分支提交了各种文件。他已经做了什么，已经在问题中进行了解释。
   
4. 简短说明：他已将数组更改为MVCArray，以便您可以获取Google用于其地图路径的确切数据类型，添加getPath（）和getPaths（）函数。我为Polygons做了同样的事情，你可以在这里下载这些文件，看看我需要改变什么，以便在DragEnd获取新的多边形路径后在@agm模块中更改的文件的Dropbox链接

您可以在您的PolyGon的鼠标向上事件中使用以下代码：
@ViewChildren（AgmPolygon）
polygonData：QueryList< AgmPolygon>;
polyMouseUp（$ event：any，index：number，polygon：any）{
var i = 0;
this.polygonData.forEach（
x => {
if（i == index）{
x.getPath（）。then（（y：any []）= > {
console.log（' - '）;
y.forEach（z => console.log（z.lat（），z.lng（）））;
}）;
}
i ++;
}
）;
}

Every time I try to get the new polygon when I edit it, either by dragend or click, I always get the initial paths of my variable.

I initialize my paths variable with:

paths: Array<LatLngLiteral> = [{lat: -12.052224, lng: -77.050342}, {lat: -12.064306, lng: -77.031790}, {lat: -12.075951, lng: -77.054554}, {lat: -12.063236, lng: -77.072506}, {lat: -12.052224, lng: -77.050342}];

Never update the paths variable whatever I do.

What am I failing? Why I can not get the final polygon with its respective paths and always get the initial? Or what is the correct way to get the new polygon?

This is my component:

<sebm-google-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
    <sebm-map-polygon [paths]="paths" [editable]="true" [polyDraggable]="true" [strokeColor]="'#c60331'" (polyDragEnd)="onDragEnd($event, paths)">
     </sebm-map-polygon>
</sebm-google-map>

解决方案

Late but I thought someone like me may get some help so adding the answer.

The current release doesn't support it so you will need to make some changes to the current node_module. See this url:

https://github.com/SebastianM/angular-google-maps/pull/991

willshowell has explained what needs to be done.

Steps:

1. Update the sebm to agm (take the current release as of now)
2. Second, update your angular to at least 2.3 because it will not work with 2.0.
3. In the link above, he has committed various files to the branch. What he has done, is already explained in the issue.
4. Short explanation: he has changed the Array to MVCArray so you can get the exact data type which google uses for it's map paths, added getPath() and getPaths() functions. I did same for Polygons you can download the files here to see what I need to change for getting new Paths for Polygons after DragEnd Dropbox link for files changed in @agm module

Once you have made changes to Node Module, you can use the following code in the mouse up event of your PolyGon: @ViewChildren(AgmPolygon) polygonData: QueryList<AgmPolygon>; polyMouseUp($event: any, index:number, polygon: any) { var i =0; this.polygonData.forEach( x =>{ if(i==index){ x.getPath().then((y: any[]) => { console.log('-'); y.forEach(z => console.log(z.lat(), z.lng())); }); } i++; } ); }

这篇关于在Sebm Google地图中的DragEnd时如何获取多边形的路径？角2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！