javascript - AmCharts - 帮助创建趋势栏

Question

我正在尝试遵循有关如何在串行类型条形图上添加趋势线的文档。

AmCharts.makeChart('chartdiv', {
      type: 'serial',
      addClassNames: true,
      theme: 'light',
      dataProvider: data,
      startDuration: 1,
      categoryField: 'month',
      graphs: [
        {
          valueField: 'complaints',
          type: 'column',
          fillAlphas: 0.8,
          balloonText: "# of complaints on [[category]]: <b>[[value]]</b>"
        },
        {
          valueField: 'expectation',
          type: 'line',
          // bullet: 'round',
          lineColor: 'green',
          balloonText: "Expected less than <b>[[value]]</b> for [[category]]",
          dashLengthField: "dashLengthLine"
        }
      ],
      categoryAxis: {
        autoGridCount: false,
        gridCount: data.length,
        gridPosition: "start",
        // labelRotation: 90
      },
      export: {
        enabled: true
      },

      trendLines: [{
            initialValue: 6,
            finalValue: 8
        }]
    });

trendingLines 在那里没有做太多事情。我尝试了很多方法来声明它，但没有成功。以下是我正在使用的一些数据:

[{
    "expectation": 2,
    "tendValue": 1,
    "month": "January",
    "complaints": 1
  }, {
    "expectation": 2,
    "month": "February",
    "complaints": 2
  }, {
    "expectation": 2,
    "month": "March",
    "complaints": 0
  }, {
    "expectation": 2,
    "month": "April",
    "complaints": 1
  }, {
    "expectation": 2,
    "month": "May",
    "complaints": 0
  }, {
    "expectation": 2,
    "month": "June",
    "complaints": 1
  }, {
    "expectation": 2,
    "month": "July",
    "complaints": 2
  }, {
    "expectation": 2,
    "month": "August ",
    "complaints": 1
  }, {
    "expectation": 2,
    "month": "September",
    "complaints": 3
  }, {
    "expectation": 2,
    "month": "October",
    "complaints": 1
  }, {
    "expectation": 2,
    "month": "November",
    "complaints": 2
  }, {
    "expectation": 2,
    "tendValue": 3,
    "month": "December",
    "complaints": 3
  } ]

Answer 1

您错过的是起点和终点的声明。您只需告诉趋势线它的值。

趋势线的最小代码应该是……像这样:

{
    "finalDate": "2012-01-22 12",
    "finalValue": 10,
    "initialDate": "2012-01-17 12",
    "initialValue": 16
}

或者在您的情况下使用initialCategory和finalCategory。看看class reference有关趋势线参数的更多信息或查看这个漂亮的小demo .