带有非比例值的折线图上的两条线

时间:2013-06-13 06:01:10

标签: graph statistics google-visualization

我正在尝试使用googlecharts线图向我显示两条线图,其中Y轴为日期,x轴为所用物质总量。这是一个折线图,比较例如每天消耗的烟草总消耗量。

我正在努力解决的问题是如何更加紧密地展示这些线条。一天消耗的总酒精量可能是1000mL,范围是900到1100,而烟草可能只是3,范围是2-4。正如你所看到的,在线图上这些线将是相距甚远,并没有真正表现出相关性。

最好的系统是什么?

1 个答案:

答案 0 :(得分:3)

你想要的是一张组合图。我从Combo Chart的示例代码开始,更改了最后一列,并添加了第二个轴。您最关心的参数是targetAxisIndex参数。

function drawVisualization() {
  // Create and populate the data table.
  var data = google.visualization.arrayToDataTable([
    ['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea', 'Rwanda', 'Average'],
    ['2004/05',  165,      938,         522,             998,           450,      614.6/100],
    ['2005/06',  135,      1120,        599,             1268,          288,      682/100],
    ['2006/07',  157,      1167,        587,             807,           397,      623/100],
    ['2007/08',  139,      1110,        615,             968,           215,      609.4/100],
    ['2008/09',  136,      691,         629,             1026,          366,      569.6/100]
  ]);

  // Create and draw the visualization.
  var ac = new google.visualization.ComboChart(document.getElementById('visualization'));
  ac.draw(data, {
    title : 'Monthly Coffee Production by Country',
    width: 600,
    height: 400,
    vAxis: {title: "Cups"},
    hAxis: {title: "Month"},
    seriesType: "bars",
    series: {5: {type: "line", "targetAxisIndex": "1"}}
  });
}