为什么我的地图上的标签不是使用amcharts从我的geojson生成的?

问题描述

我正在尝试使用amcharts生成来自geoj​​son文件中每个区域带有标签的意大利地图。我正在改编我在amcharts文档here中找到的示例。我正在使用自己的geojson文件,该文件可以在此link中找到。但是,当我这样做时,标签根本没有出现。这是我的codepen。 javascript部分(我认为这是问题的根源)如下。请注意,我是新javascript。

从geojson读取的amcharts的ID是否正确?也许是造成问题的原因,因为地图确实出现了,只是没有显示存储在ids中的区域的标签

// Create map instance
var chart = am4core.create("chartdiv",am4maps.MapChart);

// Set map deFinition
chart.geodataSource.url= 'https://raw.githubusercontent.com/anshver92/walruswondersitaly/master/italian-regions1.geojson';

// Set projection
chart.projection = new am4maps.projections.Miller();

// Create map polygon series
var polygonSeries = chart.series.push(new am4maps.MappolygonSeries());
polygonSeries.useGeodata = true;
polygonSeries.calculateVisualCenter = true;

// Configure series
var polygonTemplate = polygonSeries.mappolygons.template;
polygonTemplate.tooltipText = "{id}";
polygonTemplate.fill = am4core.color("#74B266");
polygonTemplate.propertyFields.id = "id";

// Configure label series
var labelSeries = chart.series.push(new am4maps.MapImageSeries());
var labelTemplate = labelSeries.mapImages.template.createChild(am4core.Label);
labelTemplate.horizontalCenter = "middle";
labelTemplate.verticalCenter = "middle";
labelTemplate.fontSize = 10;
labelTemplate.interactionsEnabled = false;
labelTemplate.nonScaling = true;

var ids = ["piemonte"];

// Set up label series to populate
polygonSeries.events.on("inited",function () {
  for(var i = 0; i < ids.length; i++){
    var polygon = polygonSeries.getpolygonById(ids[i]);
    if(polygon){
        var label = labelSeries.mapImages.create();
        var state = polygon.dataItem.dataContext.id.pop();
        label.latitude = polygon.visualLatitude;
        label.longitude = polygon.visualLongitude;
        label.children.getIndex(0).text = state;
    }
  }
});

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)