Google 图表轴百分比

Question

我想将数字作为百分比，但它对我不起作用。当您将鼠标悬停在图表上时，我还想去掉日期旁边的时间。

有什么想法吗？谢谢

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo</title>

<script type='text/javascript' src='/js/lib/dummy.js'></script>
<link rel="stylesheet" type="text/css" href="/css/result-light.css">
<script type='text/javascript' src="https://www.google.com/jsapi"></script>


<script type='text/javascript'>//<![CDATA[ 

google.load('visualization', '1.1', {packages: ['line']});
google.setOnLoadCallback(drawChart);

function drawChart() {

  var data = new google.visualization.DataTable();
  data.addColumn('date', 'Date');
  data.addColumn('number', 'Test 1');
  data.addColumn('number', 'Product 1');
  data.addColumn('number', 'Product 2');
  data.addColumn('number', 'Product 3');      

  data.addRows([



  [new Date(2015, 01, 1),  73, 88, 96, 79],[new Date(2015, 02, 1),  100, 75, 86, 90],[new Date(2015, 03, 1),  76, 95, 93, 86],[new Date(2015, 04, 1),  95, 75, 100, 98],[new Date(2015, 05, 1),  91, 31, 88, 85],[new Date(2015, 06, 1),  90, 74, 72, 79],[new Date(2015, 07, 1),  95, 80, 90, 78],      ]);

  var options = {
    chart: {
      title: 'test',
      subtitle: '',
    },
    width: 1300,
    height: 600,
    vAxis: { format: 'percent' }



  };

  var chart = new google.charts.Line(document.getElementById('linechart_material'));

  chart.draw(data, options);
  }
//]]>  

</script>


</head>
<body>


<div id="linechart_material"></div>

 </body>


 </html>

Answer 1

阅读 Line Chart documentation 你可以知道你需要使用 chart.draw(data, google.charts.Line.convertOptions(options)); 来替换你的 chart.draw(data, options);。

虽然使用 % 后缀会导致一些不需要的格式，它会将您的数据乘以 100，但您可以先将数据除以 100。

Google 图表轴百分比

Google Charts Axis Percentage

google-visualization