带有Angular 9的AmCharts：加载csv数据，图表为空白

问题描述

我正在使用带有AmCharts 4的Angular 9。

我需要将CSV数据加载到饼图中。数据如下：

Operation Type,Quantity
Internal,687
External,456

图表声明为：

ngAfterViewInit() {
    this.chart = am4core.create(this.getChartID(),am4charts.PieChart);

    const subtitulo = this.chart.titles.create();
    subtitulo.text = this.subtitulo;
    subtitulo.fontSize = 10;

    const titulo = this.chart.titles.create();
    titulo.text = this.titulo;
    titulo.fontSize = 15;
    titulo.marginTop = 10;
}

此数据来自Servlet（是的，所有传递的CORS）。 我可以确认是否已加载数据 （我可以正确看到“ chart.data”值），但是数据加载后未绘制其自身的图表。

我用来加载数据的代码是：

this.chart.dataSource.url = 'https://myserver.com/ng/DataService/?param1=342&param2=filterN&format=csv';

const csvParser = new am4core.CSVParser();
csvParser.options.useColumnNames = true;
this.chart.dataSource.parser = csvParser;
this.chart.dataSource.events.on('error',(error) => { console.log('Datasource error: ',error); });

this.chart.dataSource.load();

在以下位置创建图表 执行“加载”后，我可以在“开发人员工具”中看到已经正确加载了数据，但是图表仍然为空。

我想念什么吗？

解决方法

仅定义图表对象和数据源URL是不够的。每种图表类型都需要定义，以定义其他特征，包括从中提取数据的字段。

var pieSeries = this.chart.series.push(new am4charts.PieSeries());
pieSeries.dataFields.value = "Quantity";
pieSeries.dataFields.category = "Operation Type";