在右侧添加辅助轴

时间:2014-01-25 08:46:10

标签: javascript google-visualization

我想使用GOOGLE CHARTS创建一个组合图,其中我的销售位于左侧y轴,而Salary位于右侧y轴(次级轴)上,位于折线图上。 但是,我的代码没有运行。无法找出问题所在。 请帮忙。 代码片段:

<script type="text/javascript" src="//www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('visualization', '1', {packages: ['corechart']});
</script>
<script type="text/javascript">
  function drawVisualization() {
    // Create and populate the data table.
    var data = google.visualization.arrayToDataTable([
      ['Employee ID', 'Sales', 'Salary'],
      ['7000234', 560024, 9765],
      ['7000260', 1180800, 15621],
      ['7000262', 244308, 9212],
      ['7000273', 390912, 8650],
      ['7000288', 870445, 6692]
    ]);

    // Create and draw the visualization.
    var ac = new google.visualization.ComboChart(document.getElementById('visualization'));
    ac.draw(data, {
      title : 'Sales and Salary',
      width: 800,
      height: 400,
      hAxis: {title: "Employee ID"},
      vAxes: [ 0: {title: "Sales"}, 1: {title:"Salary"}],
      series: {
              0:{ type: "bars", targetAxisIndex: 0 },
              1: { type: "line", targetAxisIndex: 1}
          },
    });
  }


  google.setOnLoadCallback(drawVisualization);
</script>

1 个答案:

答案 0 :(得分:2)

似乎唯一的错误是选项vAxes。应使用{...}代替[...]。你必须改变:

vAxes: [ 0: {title: "Sales"}, 1: {title:"Salary"}],

vAxes: { 0: {title: "Sales"}, 1: {title:"Salary"}},

请参阅example at jsbin