谷歌图表折线图不显示0-100作为百分比尺度

我试图创建一个基本的Google Charts line chart来显示3个值随时间变化的百分比。图表正在显示，但我努力让vAxis显示0 - 100％，最高值仅仅是我数据集中最高的值（45％）。谷歌图表折线图不显示0-100作为百分比尺度

这是我使用的代码：

<html> 
<head> 
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
    <script type="text/javascript"> 
     google.charts.load('current', {'packages':['line']}); 
     google.charts.setOnLoadCallback(drawChart); 

     function drawChart() { 

      var data = new google.visualization.DataTable(); 
      data.addColumn('date', 'date'); 
      data.addColumn('number', 'tool1'); 
      data.addColumn('number', 'tool2'); 
      data.addColumn('number', 'tool3'); 

      data.addRows([ 
      [new Date(2000, 8, 5), 10, 20, 30], 
      [new Date(2001, 8, 5), 20, 30, 40], 
      [new Date(2002, 8, 5), 25, 35, 45], 
      ]); 

      var options = { 
      chart: { 
       title: 'Tool rollout' 
      }, 
      vAxis: {minValue: 0, 
        maxValue: 100, 
        format: "percent" 
        }, 
      width: 900, 
      height: 500, 
      }; 

      var chart = new google.charts.Line(document.getElementById('line')); 
      chart.draw(data, options); 
    } 
    </script> 
</head> 
<body> 
    <div id="line"></div> 
</body> 
</html>

但是，这是它是如何渲染：

该文档显示，设置vAxis.maxValue“移动的最大值垂直轴到指定值;在大多数图表中这将是向上的，如果设置为小于数据的最大y值，则忽略。但我显然错过了一些东西，因为这似乎没有被使用。

使用材料图表谷歌API

来源

2016-01-14 Rob Gudgeon

You're，请尝试使用：

vAxis: { 
     format: "#.#%", 
     viewWindow: { 
      max:1.0, 
      min:0.2 
     } 
}

来源

2017-05-11 19:37:20

谷歌图表折线图不显示0-100作为百分比尺度

回答

相关问题