为复杂的数据图表创建串行条形图 [英] creating serial bar graph for complex data amcharts

问题描述

以下是我作为json从服务器获得的响应:

Below is the response I get as json from server:

[{
  "data1": {
    "name": "Test1",
    "count": 0,
    "amount": 0,
    "amtData": [
      0,0,0,0
    ],
    "cntData": [
      0,0,0,0
    ],
    "color": "#FF0F00"
  },
  "data2": {
    "name": "Test2",
    "count": 1,
    "amount": 4164,
    "amtData": [
      4164,0,0,0
    ],
    "cntData": [
      1,0,0,0
    ],
    "color": "#FF0F00"
  },
  "data3": {
    "name": "Test3",
    "count": 1,
    "amount": 2509,
    "amtData": [
      2509,0,0,0
    ],
    "cntData": [
      1,0,0,0
    ],
    "color": "#FF0F00"
  },
  "data4": {
    "name": "Test4",
    "count": 1,
    "amount": 9909,
    "amtData": [
      9909,0,0,0
    ],
    "cntData": [
      1,0,0,0        
    ],
    "color": "#FF0F00"
  },
  "data5": {
    "name": "Test5",
    "count": 0,
    "dollars": 0,
    "amount": [
      0,0,0,0
    ],
    "cntData": [
      0,0,0,0
    ],
    "color": "#FF0F00"
  }
}]

，这里正在尝试创建我的chart.

and here am trying to create my chart.

var chart = AmCharts.makeChart("chartdiv", {
  "theme": "light",
  "type": "serial",
  "dataProvider": data, //assigning it as data
  "startDuration": 1,
  "graphs": [{
    "balloonText": "<b>[[category]]</b><br>starts at [[count]]<br>ends at [[amount]]",
    "colorField": "color",
    "fillAlphas": 0.8,
    "lineAlpha": 0,
    "openField": "count", //base start field
    "type": "column",
    "valueField": "amount" //value field
  }],
  "rotate": true,
  "columnWidth": 0.8,
  "categoryField": "name", //name field
  "categoryAxis": {
    "gridPosition": "start",
    "axisAlpha": 0,
    "gridAlpha": 0,
    "position": "left"
  },
  "export": {
    "enabled": true
  }
});

我尝试了多少次，但未得到定义，而不是chart.我也无法使用console errors.我该如何重组这些复杂的数据并从中生成图表?

How much ever I try, I am getting undefined instead of chart.. No console errors either I could make use of. How can I go restructuring this complex data and produce a graph out of it?

这是 小提琴 ，而这只是 样本小提琴 .

Here is the fiddle and this is just sample fiddle which I was referring.

推荐答案

您应该从dataProvider删除data1到data5属性:

var data = [
  {
    "name": "Test1",
    "count": 0,
    "amount": 0,
    "amtData": [
      0,
      0,
      0,
      0
    ],
    "cntData": [
      0,
      0,
      0,
      0
    ],
    "color": "#FF0F00"
  },
  ...
];

在此处

这篇关于为复杂的数据图表创建串行条形图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！