График акций amCharts с несколькими наборами данных не отображается

Question

Я просмотрел примеры и документы amCharts.

Вот моя проблема: диаграмма показывает только одну линию, а не две, как определено в двух наборах данных:

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 собственность на 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);