本文介绍了Google图表支持双y轴(v轴)吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

图表api支持双重v轴刻度,如。

The Flot chart api supports dual v-axis scales, as shown by this example.

我正在使用Google Charts - 这是否也可能与Google?我已经看过示例和文档,但是找不到任何示例/引用来表明它支持双轴图表。

I'm using Google Charts - is this possible also with Google? I've had a look through the examples and docs, but can't find any examples / references to indicate it does support dual axis charts.

推荐答案

我花了一段时间,想出这一点,但Google图表确实支持双Y轴(v轴)。我想使用Javascript API而不是HTML界面。

It took me a while, to figure this out, but Google Charts does support dual Y-axis (v-axis). I want to use the Javascript API and not the HTML interface.

这个例子可以在这里测试:

This example can be tested here:http://code.google.com/apis/ajax/playground/?type=visualization#line_chart

使用此代码替换所有代码,显示如何具有两个不同的Y轴刻度:

Replace all of that code with this code showing how to have two different Y-axis scales:

function drawVisualization() {
  // Create and populate the data table.
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'x');
  data.addColumn('number', 'Cats');
  data.addColumn('number', 'Blanket 1');
  data.addColumn('number', 'Blanket 2');
  data.addRow(["A", 1, 1, 0.5]);
  data.addRow(["B", 2, 0.5, 1]);
  data.addRow(["C", 4, 1, 0.5]);
  data.addRow(["D", 8, 0.5, 1]);
  data.addRow(["E", 7, 1, 0.5]);
  data.addRow(["F", 7, 0.5, 1]);
  data.addRow(["G", 8, 1, 0.5]);
  data.addRow(["H", 4, 0.5, 1]);
  data.addRow(["I", 2, 1, 0.5]);
  data.addRow(["J", 3.5, 0.5, 1]);
  data.addRow(["K", 3, 1, 0.5]);
  data.addRow(["L", 3.5, 0.5, 1]);
  data.addRow(["M", 1, 1, 0.5]);
  data.addRow(["N", 1, 0.5, 1]);


  // Create and draw the visualization.
  new google.visualization.LineChart(document.getElementById('visualization')).
      draw(data, {curveType: "function", width: 500, height: 400,
    vAxes: {0: {logScale: false},
            1: {logScale: false, maxValue: 2}},
    series:{
       0:{targetAxisIndex:0},
       1:{targetAxisIndex:1},
       2:{targetAxisIndex:1}}}
          );
}

添加 maxValue:2 到代码,并设置系列1& 2到该轴,它们在第二个轴上正常工作。

By adding maxValue: 2 to the code, and setting series 1 & 2 to that axis, they work properly on a second axis.

这篇关于Google图表支持双y轴(v轴)吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-06 05:35