问题描述
我正在尝试使用amcharts生成来自geojson文件中每个区域带有标签的意大利地图。我正在改编我在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 (将#修改为@)