Amcharts 地图，如何设置和获取 MapPolygonSeries 的 id？

Question

我想获取 MapPolygonSeries 的 ID，以便知道单击了哪个元素。

我的目标是在下拉列表中显示所选国家（在地图中）。

目前我有以下代码用于在点击时缩放到地图区域。

// Zooming to map area on click
polygonTemplate.events.on("hit", (ev) => {
  ev.target.series.chart.zoomToMapObject(ev.target, this.COUNTRY_ZOOM);
  // How to get the ID of the of the map object here? ev.id?
  this.handleCountrySelection();
});

为了创建多边形系列，我使用 am4geodata_worldHigh 和

useGeodata = true

来自图表。

Answer 1

不清楚您所说的 MapPolygonSeries 的 ID 是什么意思。

如果您想提供自己的方式来识别 MapPolygonSeries，您可以将字符串分配给 its name property。

使用 useGeodata = true，将向来自 amCharts 的 geojson 的系列中的每个 MapPolygon 提供一个 ISO2 ID 和名称。因此，如果您在用户单击它时正在寻找国家/地区的 ID/name，这可以通过 mapPolygon 的 dataItem.dataContext 在您的事件处理程序中找到，看起来像 ev.target.dataItem.dataContext，例如：

// identify a series by its name polygonSeries.name = "worldSeries"; // Zooming to map area on click polygonTemplate.events.on("hit", (ev) => { ev.target.series.chart.zoomToMapObject(ev.target, this.COUNTRY_ZOOM); // How to get the ID of the of the map object here? ev.id? console.log("Series name: ", ev.target.series.name); console.log("Country ISO2 id: ", ev.target.dataItem.dataContext.id); console.log("Country ISO2 name: ", ev.target.dataItem.dataContext.name); this.handleCountrySelection(); });

简单的演示，将所有内容放在一起： https://codepen.io/team/amcharts/pen/e3fd144dcf886d29d27b7f47df73f565/?editors=1111

Amcharts 地图，如何设置和获取 MapPolygonSeries 的 id？

Amcharts Maps, how to set and get id of MapPolygonSeries?

amcharts