将数据从数组传递到 amchart 雷达图表系列答案

【问题标题】：Passing data from array to amchart radar chart series将数据从数组传递到 amchart 雷达图表系列
【发布时间】：2019-08-14 12:12:19
【问题描述】：

我想从添加到数组的数据表中传递数据，但我看不到如何应用它。我查看了文档以执行此操作，但无济于事。

代码如下：

/* START AMCHART CODE*/ 
//////////////////////////////////////////////////////////////////////////////
/* Set themes */
am4core.useTheme(am4themes_dark);
am4core.useTheme(am4themes_animated);

/* Create chart instance */
var chart = am4core.create("js_chart", am4charts.RadarChart);

/* Add data */
chart.data = [{
  "region": "National",
  "value1": 501,
  "value2": 250,
  "value3": 250

}, {
  "region": "Region",
  "value1": 301,
  "value2": 222,
  "value3": 250
}, {
  "region": "PJ Lowrie",
  "value1": 266,
  "value2": 179,
  "value3": 250
}, {
  "region": "Tameside",
  "value1": 165,
  "value2": 298,
  "value3": 250
}, {
  "region": "Salford",
  "value1": 139,
  "value2": 299,
  "value3": 250
}, {
  "region": "Manchester",
  "value1": 336,
  "value2": 185,
  "value3": 250
}];

/* Read data from chartdata */
console.log(chartdata);

var chartData2 = new Array();
    for (var i = 0; i < chartdata.length; i++) {
    var category= new Object();
    category.category=chartdata[i].items[0];
    category.Done=chartdata[i].items[1];
    category.Begun=chartdata[i].items[2];
    category.None=chartdata[i].items[3];
    chartData2.push(category);  
}
/* End Read data from chartdata */
//chart.data =chartData2;

/* Create axes */
chart.dataProvider=chartData2;
var categoryAxis = chart.xAxes.push(new am4charts.CategoryAxis());
categoryAxis.dataFields.category = "region";

var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());

valueAxis.min = 0;
valueAxis.max = 1000; 

/* Create and configure series */
var series1 = chart.series.push(new am4charts.RadarColumnSeries());
series1.dataFields.valueY = "value1";
series1.dataFields.categoryX = "region";
series1.name = "None";
series1.strokeWidth = 0;
series1.columns.template.tooltipText = "Series: {name}\nCategory: {categoryX}\nValue: {valueY}";
series1.sequencedInterpolation = true;
series1.sequencedInterpolationDelay = 100;
series1.stacked = true;
series1.fill = "red";

var series2 = chart.series.push(new am4charts.RadarColumnSeries());
series2.dataFields.valueY = "value2";
series2.dataFields.categoryX = "region";
series2.name = "Begun";
series2.strokeWidth = 0;
series2.columns.template.tooltipText = "Series: {name}\nCategory: {categoryX}\nValue: {valueY}";
series2.sequencedInterpolation = true;
series2.sequencedInterpolationDelay = 100;
series2.stacked = true;
series2.fill = "gold";

var series3 = chart.series.push(new am4charts.RadarColumnSeries());
series3.dataFields.valueY = "value3";
series3.dataFields.categoryX = "region";
series3.name = "Done";
series3.strokeWidth = 0;
series3.columns.template.tooltipText = "Series: {name}\nCategory: {categoryX}\nValue: {valueY}";
series3.sequencedInterpolation = true;
series3.sequencedInterpolationDelay = 100;
series3.stacked = true;
series3.fill = "green";

/* Add legend */
chart.legend = new am4charts.Legend();

/* Add cursor */
chart.cursor = new am4charts.RadarCursor();

    /*END AMCHART CODE*/

我有一个使用硬编码数据完美工作的雷达图，但我想从数组中传递数据。谢谢 J

【问题讨论】：

您是否查看过文档以了解如何执行此操作？ ??????
哈哈它不会让我发帖说有太多的代码;）
删除重复的句子并为代码块启用语法高亮
@JayW 您尝试传入的数据格式很可能有问题。请注意，AmCharts 需要一个对象数组，其中属性与您在其中定义的字段对齐您的系列，可以在网站上的每个演示中看到。如果您的数据看起来不像硬编码数据，那么这是您应该首先查看的内容。你能发布你的数据是什么样的吗？
谢谢。 :) 我猜可能是这样。让我看看我能不能解决这个问题。如果没有，我会发布。

标签： javascript amcharts radar-chart amcharts4

【解决方案1】：

感谢您的回复。我已经通过这个演示为自己解决了这个问题并应用了一些其他逻辑 amcharts.com/demos/line-graph/

/* Read data from chartdata */

var chartData2 = [];
var region=0;
var Done=0;
var None ='';
    for (var i = 0; i < chartdata.length; i++) {
    region=chartdata[i].items[0];
    Done=chartdata[i].items[1];
    Begun=chartdata[i].items[2];
    None=chartdata[i].items[3];
    chartData2.push({region:region, Done: Done, Begun: Begun, None: None}); 
}

chart.data = chartData2;`

【讨论】：