未显示多个数据集的 amCharts 股票图表

Question

我浏览了 amCharts 的示例和文档。

这是我的问题：图表只显示一条线，而不是 2 个数据集中定义的两条线：

var chart;

function createStockChart() {
  chart = new AmCharts.AmStockChart();


  // DATASETS //////////////////////////////////////////

    var dataSet = new AmCharts.DataSet();
    chart.dataSets = [{
      title: "XWD.TO",
      color: "#000000",
      fieldMappings: [ {
      fromField: "value",
      toField: "value"
      }, {
      fromField: "volume",
      toField: "volume"
      } ],
      dataProvider: chartData,
      categoryField: "date"
    },

    {
      title: "portfolio-top-9-12-2015",
      color: "#FF0000",
      fieldMappings: [ {
      fromField: "value",
      toField: "value"
      }, {
      fromField: "volume",
      toField: "volume"
      } ],
      dataProvider: chartData2,
      categoryField: "date"
    }];



  // PANELS ///////////////////////////////////////////
  // first stock panel
  var stockPanel1 = new AmCharts.StockPanel();
  stockPanel1.showCategoryAxis = false;
  stockPanel1.title = "Price";
  stockPanel1.percentHeight = 70;

  // graph of first stock panel
  var graph1 = new AmCharts.StockGraph();
  graph1.valueField = "value";
  graph1.comparable = true;
  graph1.compareField = "value";
  graph1.type = "smoothedLine";
  graph1.bullet = "round";
  graph1.lineThickness = 2;
  graph1.bulletBorderColor = "#FFFFFF";
  graph1.bulletBorderAlpha = 1;
  graph1.bulletBorderThickness = 3;
  stockPanel1.addStockGraph(graph1);

}

整页代码： http://www.fanta-trade.eu/chart.php?tipo=a&code=XWD.TO&compare_top=1&time=1449658858

这就像代码没有获取第二个数据集一样。

Answer 1

股票图表支持多个数据集。但是，默认情况下它不会为每个数据集绘制图表。

默认情况下，它只绘制主要选定数据集的图表 - 第一个数据集。

为了让它为其他数据集绘制图表，它们需要 "compared"。

可以通过在数据集选择器中选择它们（如果启用了一个）来比较它们，或者通过将数据集的 compared 属性设置为 true.

{
  title: "portfolio-top-9-12-2015",
  color: "#FF0000",
  fieldMappings: [ {
    fromField: "value",
    toField: "value"
  }, {
    fromField: "volume",
    toField: "volume"
  } ],
  dataProvider: chartData2,
  categoryField: "date",
  compared: true
}

另请注意，对比图使用不同的外观设置。您可以通过图形的 compareGraph 设置来设置这些设置。即：

// graph of first stock panel
var graph1 = new AmCharts.StockGraph();
graph1.valueField = "value";
graph1.comparable = true;
graph1.compareField = "value";
graph1.type = "smoothedLine";
graph1.bullet = "round";
graph1.lineThickness = 2;
graph1.bulletBorderColor = "#FFFFFF";
graph1.bulletBorderAlpha = 1;
graph1.bulletBorderThickness = 3;
graph1.compareGraph = {
  "type": "smoothedLine",
  "bullet": "round",
  "lineThickness": 2,
  "bulletBorderColor": "#FFFFFF",
  "bulletBorderAlpha": 1,
  "bulletBorderThickness": 3
};
stockPanel1.addStockGraph(graph1);

未显示多个数据集的 amCharts 股票图表

amCharts Stock Chart with multiple datasets not showing

javascript

amcharts

amstock