首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Google图中的双Y轴与双y轴上的自定义步骤

Google图中的双Y轴与双y轴上的自定义步骤
EN

Stack Overflow用户
提问于 2016-08-22 12:39:46
回答 1查看 448关注 0票数 0

我面临的问题与内存图,双轴,自定义步骤,在每个轴,所以转移到谷歌图表。谷歌图表是否支持双y轴与最小和最大的自定义步骤在每个轴上?

图片附呈,以供参考:

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-08-22 15:23:51

若要设置双y轴,请更改其中一个targetAxisIndexseries.

代码语言:javascript
复制
  series: {
    1: {
      targetAxisIndex: 1
    }
  },

若要设置min和max,请使用viewWindow

对于步骤,必须提供自己的ticks

对于每个vAxes

代码语言:javascript
复制
  vAxes: {
    0: {
      viewWindow: {
        min: 0,
        max: 20
      },
      ticks: [0, 5, 10, 15, 20]
    },
    1: {
      viewWindow: {
        min: 120,
        max: 240
      },
      ticks: [120, 160, 200, 240]
    }
  }

看下面的工作片段..。

代码语言:javascript
复制
google.charts.load('current', {
  callback: function () {
    var data = google.visualization.arrayToDataTable([
      ['Label', 'Series 0', 'Series 1'],
      ['a', 10, 150],
      ['b', 12, 180],
      ['c', 14, 210],
      ['d', 16, 240]
    ]);

    var container = document.getElementById('chart_div');
    var chart = new google.visualization.ColumnChart(container);

    chart.draw(data, {
      series: {
        1: {
          targetAxisIndex: 1
        }
      },
      vAxes: {
        0: {
          viewWindow: {
            min: 0,
            max: 20
          },
          ticks: [0, 5, 10, 15, 20]
        },
        1: {
          viewWindow: {
            min: 120,
            max: 240
          },
          ticks: [120, 160, 200, 240]
        }
      }
    });
  },
  packages: ['corechart']
});
代码语言:javascript
复制
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/39079811

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档