AMCharts 4 - 应用于单个国家/地区时，地图笔划不均匀

Question

如上图所示。我已经向美国申请了中风。然而，大陆中风的顶部明显比中风的其他部分更薄。我的配置如下：

  polygonTemplate.stroke = am4core.color('#2c2626')
  polygonTemplate.strokeWidth = 0
  polygonTemplate.nonScalingStroke = true

然后我有一个适配器来抚摸活跃的国家，

polygonTemplate.adapter.add('strokeWidth', (stroke, target) => {
    if (target.dataItem && target.dataItem.dataContext && this.selectedCountry) {
      if (target.dataItem.dataContext.id === this.selectedCountry.id) {
        return 2
      }
    }
    return stroke
  })

从我在网上的例子中可以找到，这是应用中风的正确方法。我有没有办法在全国范围内制造这种中风？这种情况发生在大多数国家，但有一些国家并没有那么糟糕......

编辑：感谢Sam的帮助，我现在中风了。但似乎我必须两次按下一个新的国家，才能采取积极的状态 - 一次将旧国家切换为非活动状态，然后再次增加活跃状态。 GIF如下

Answer 1

问题是，边界国家与所选国家的中风重叠。我将strokeWidth增加到10并将fillOpacity设置为0.6。您可以在下面的图片或that代码笔中清楚地看到。

在适配器中设置zIndex也不会改变我的任何内容。

但你可以使用states：

使用要使用的属性创建活动（或自定义）状态。你也可以在那里使用zIndex。现在将该状态设置为您要突出显示的每个国家/地区。

var polygonTemplate = polygonSeries.mapPolygons.template;
polygonTemplate.tooltipText = "{name}";
polygonTemplate.fillOpacity = 0.6;
polygonTemplate.stroke = am4core.color('#2c2626');
polygonTemplate.strokeWidth = 0;
polygonTemplate.zIndex = 0;
polygonTemplate.nonScalingStroke = true;

// Create active state
var activeState = polygonTemplate.states.create("active");
activeState.properties.strokeWidth = 10;
activeState.properties.zIndex = 1;

// Create an event to toggle "active" statestate
polygonTemplate.events.on("hit", function(ev) {
  ev.target.isActive = !ev.target.isActive;
  console.log(ev.target.dataItem.dataContext.id);
});

chart.events.once('inited', event => {
  polygonSeries.mapPolygons.values.find(i => i.dataItem.dataContext.id === 'US').isActive = true;
});

结果如下：

This代码笔显示状态示例。希望有所帮助。

编辑：

要使用双击切换活动状态，您只需使用hit事件（doublehit）替换docs事件。但是你可能想立即双击缩放。这可能与以下行（docs）：

chart.seriesContainer.events.disableType("doublehit");
chart.chartContainer.background.events.disableType("doublehit");

我创建了this代码笔来向您展示一个例子。