在谷歌地图上使用drawingManager完成多边形后，我如何将id分配给多边形

Question

我使用drawingManager让用户在地图上绘制多边形，效果很好。部分功能是保存多边形，因此用户可以保存一个或多个项目。为了保持跟踪，我将它们保存到阵列中多边形。这就是我遇到问题的地方。。

当用户初始创建多边形时，我如何在该多边形上设置类似ID的自定义关键点，以便将其保存在带有多边形路径的数组中？这样，如果有任何更改，我知道我必须更新或可能删除哪个多边形？

当我从代码中加载多边形时，我可以这样做。。

const polygon = new google.maps.Polygon({
draggable: true,
editable: true,
paths: this.polygonPts,
strokeOpacity: 0.8,
strokeWeight: 3,
fillOpacity: 0.35,
id: 'a1b484c5-0584-49c7-8263-442b9dfbe57b',
});

即便如此，系统仍会抱怨：

对象文字只能指定已知属性，而"name"不能存在于类型"PolygonOptions"中。

所以我的问题是，我如何在PolygonOptions中为自定义键分配值，也是消除此错误的唯一方法来扩展"PolygonOptions"界面？

Answer 1

除非使用谷歌地图的数据层，否则无法为覆盖指定额外的属性。数据层允许您使用自定义特性。

话虽如此，为什么不使用创建自己的映射对象呢？类似这样的东西：

const polygonsById = {
'a1b484c5-0584-49c7-8263-442b9dfbe57b': polygon1,
'a1b484c5-0584-49c7-8263-123456789012': polygon2,
...
};

编辑

我看到你的问题被标记为angular。尝试@bespunky/angular-google-maps库。它非常灵活。在覆盖层的意义上，您可以在每个覆盖层(在您的情况下是多边形(上设置一个custom字段，其中包含您想要的任何数据。

附加自定义值的文档

自定义值的实时示例

开始使用@bespunky/angular谷歌地图

库会为您跟踪覆盖图。您不必自己创建任何映射，还可以获得其他好处。

npm install@bespunky/angular谷歌地图