GoogleChartのメーター表示で%表示する - まゆたまガジェット開発逆引き辞典

GoogleChartのメーター表示、gaugeで%表示をします。
%表示をするにはGoogle Visualization APIのNumberFormatを使います。

var formatter = new google.visualization.NumberFormat(
   
	{suffix: '%',pattern:'#'}
);
    formatter.format(data,1);

gaugeで使った場合は以下になります。

<html>
  <head>
    <meta charset="UTF-8">
	
     <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["gauge"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {

        var data = google.visualization.arrayToDataTable([
          ['Label', 'Value'],
          ['Memory', 80],
      
        ]);

        var options = {
          width: 400, height: 120,
          redFrom: 90, redTo: 100,
          yellowFrom:75, yellowTo: 90,
          minorTicks: 5,
		  animation: {
            duration: 1000,
            easing: 'inAndOut'
        },
redColor: '#AE0239',yellowColor: '#EDB872'

		  
        };

        var chart = new google.visualization.Gauge(document.getElementById('chart_div'));
		
        chart.draw(data, options);
//setIntervalの3000はスピード
        setInterval(function() {
          data.setValue(0, 1, 40 + Math.round(60 * Math.random()));
		  
	var formatter = new google.visualization.NumberFormat(
   
	{suffix: '%',pattern:'#'}
);
    formatter.format(data,1);
          chart.draw(data, options);
        }, 3000);
        
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 400px; height: 120px;"></div>
  </body>
</html>