（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

没有必要拥有“独立的数据集”。数据集实际上是一个股票图表功能，而不是一个串行图表功能。

在您的功能generateGraphsFromData中，您可以简单地为图形添加颜色和样式设置。您可以从表1中给出不同于图表的图形。您只需要找到一种方法来告诉函数哪个图来自哪个表。

查看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 
// ...