谷歌组合图表与堆积的条形图和线条

时间:2015-04-28 23:26:43

标签: graph charts google-visualization google-chartwrapper

想知道是否有人可以提供帮助,我正在尝试使用堆叠条和两条线创建谷歌图表。我能够创建一条线,但不知道如何在同一图表中添加另一条线。我想将“Average2”显示为折线图。

google.setOnLoadCallback(drawVisualization);

function drawVisualization() {
  // Some raw data (not necessarily accurate)
  var data = google.visualization.arrayToDataTable([
    ['Month', 'Bolivia', 'Ecuador',   'Average1' , 'Average2'],
    ['April',  165,      938, 614.6 , 400],
    ['May',  135,      1120,  682 , 500],
    ['June',  157,      1167,  623, 600],
    ['July',  139,      1110,  609.4, 450],
    ['August',  136,      691,   569.6 , 700]
  ]);

  var options = {
    title : 'Month (Q2-Q1 2015)',
    vAxis: {title: ""},
    hAxis: {title: ""},
      isStacked: true,
    seriesType: "bars",
    series: {2: {type: "line"}},
 
  };

  var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
  chart.draw(data, options);
}
<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['corechart']}]}"></script>
       <div id="chart_div" style="width: 900px; height: 500px;"></div>

3 个答案:

答案 0 :(得分:9)

尝试:

series: {2: {type: "line"}, 3: {type: "line"}},

答案 1 :(得分:1)

像Sander说的那样,你需要将条形定义为标准条形以获得堆积条形。数据行0和1是条形,2和3是条形。例如:

   var options = {
      title: 'Thats my fancy stacked bars and line chart',
      colors:['#FF0000', '#009900', '#0000FF','#00FFFF'],
      seriesType:'bars',
      isStacked: true,        
      series:{
         2: {type:'line'},
         3: {type:'line'}
      }
   };

瞧: example chart screenshot

答案 2 :(得分:0)

您可以定义默认类型并覆盖特定系列

seriesType: "line",
series: {
    1: {
       type: "bars"
    }
}

现在第一个系列的类型为bar,其他系列默认为line