（amCharts）如何将多个（两个）数据集放在一个图表中，并用不同的颜色方案区分每个数据集？

Question

我正在尝试从两个数据集制作图表。这两个数据都来自HTML中的两个表。

使用我目前拥有的代码，这两个表仅合并为一个数据集。我想将每个表分隔为自己的数据集，因为：

• 我想让每个数据集都有自己的颜色。例如。表A中的数据全部为橙色;表B中的数据全部用蓝色显示。
• 每个数据之间的差异将来自其线条样式。数据1将具有较粗的线，数据2将具有虚线等

这是我打算制作的图表。

以下是我当前的代码及其结果：http://jsfiddle.net/3j3s1ba7/4/

这些是我从表中获取数据的行

        function generateChartData() {

          // initialize empty array
          chartData = [];

          // get the table
          var table = document.getElementById( 'dataTable' );

          // get table rows
          var rows = table.getElementsByTagName( 'tr' );

          // iterate through the <td> elements of the first row
          // and construct chart data out of other rows as well
          var years = rows[ 0 ].getElementsByTagName( 'th' );
          var row1_desc = rows[ 1 ].getElementsByTagName( 'td' );
          var row2_desc = rows[ 2 ].getElementsByTagName( 'td' );
          var row3_desc = rows[ 3 ].getElementsByTagName( 'td' );

          var row
          for ( var x = 0; x < years.length; x++ ) {
            chartData.push( {
              "year": years[ x ].innerHTML,
              "row1_desc": row1_desc[ x ].innerHTML,
              "row2_desc": row2_desc[ x ].innerHTML,
              "row3_desc": row3_desc[ x ].innerHTML
            } );
          }
        }

在amCharts文档中，它被解释为possible to have two data sets, but it seems not at once。

知道该怎么做吗？

Answer 1

无需“单独的数据集”。 DataSet实际上是Stock Chart功能，而不是Serial Chart功能。

在您的函数generateGraphsFromData中，您只需在图表中添加颜色和样式设置即可。您可以使表1中的图形与表2中的图形不同。您只需要找到一种方法来告诉函数哪个图表来自哪个表。

查看dashLength和lineColor设置：https://docs.amcharts.com/3/javascriptcharts/AmGraph。

var graph_color = "orange"; // or blue
var graph_dashLength = 2;

var graph = new AmCharts.AmGraph();
graph.title = valueField;
graph.lineColor = graph_color,
graph.dashLength = graph_dashLength
// ...