Number format of axis - Google Gauge
NickName:Tom Jones Ask DateTime:2016-02-02T20:53:08

Number format of axis - Google Gauge

I am trying to change the number format of the axis on a google gauge. By default, the axis value is a whole number (e.g. 0, 120) but I would like to show a £ sign and format as currency (e.g. £0, £120). I have been able to change the format of the value shown at the bottom of the gauge using NumberFormat but cannot apply to the rest of the gauge.

The code for the basic gauge is as follows:

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

  function drawChart() {

        var data1 = google.visualization.arrayToDataTable([
          ['Label', 'Value'],
          ['Spend', 80],
        ]);
        var options1 = {
          width: 500, height: 300
        };

        // change number format to £
        var formatter = new google.visualization.NumberFormat(
        {pattern: '£###,###'});
        formatter.format(data1, 1);

        var chart = new google.visualization.Gauge(document.getElementById('chart_div1'));
        chart.draw(data1, options1);

  }
</script>
</head>

<body>
 <div id="chart_div1"></div>
</body>
</html>

How do I add a £ sign to the numbers on the outside of the gauge? Thank you.

Copyright Notice:Content Author:「Tom Jones」,Reproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article:https://stackoverflow.com/questions/35154091/number-format-of-axis-google-gauge

More about “Number format of axis - Google Gauge” related questions

Number format of axis - Google Gauge

I am trying to change the number format of the axis on a google gauge. By default, the axis value is a whole number (e.g. 0, 120) but I would like to show a £ sign and format as currency (e.g. £0, ...

Show Detail

How to convert Google Gauge Chart in PDF Format

I just want to know how to convert Google Gauge Chart in PDF Format. Is there any way to get a url for gauge chart like bar chart and pie chart, which I have sent and received respective gauge cha...

Show Detail

Google Gauge Float Value With Trailing Zeroes

I'm using a Google Gauge Chart. All is working fine, except I noticed when I feed it a float value, if the value is a whole number (e.g. 17.0), the gauge shows 17 as the value instead of 17.0. If I

Show Detail

Format time in google gauge chart

Is there anyway to format Google Gauge chart from seconds to time like this?

Show Detail

How to change marker labels in anychart horizontal gauge?

I am using anychart for creating a percentage horizontal gauge. And i want to change the marker information to show what i want. I found nothing on the documentation about it. I'm using the

Show Detail

Google Gauge chart not displaying

I want to create and display a google gauge chart on a webpage for a remote monitoring program I am developing. I am using an eWON Flexy 201 to do this. I am just having trouble getting the gauge to

Show Detail

How can I format Google Chart Gauge with decimal % on min, max?

I know there is an option like min, max (number type) to configure the values but i would like to know if there is possible to set them like... 0.00% to 100.00% I know there is possible to do on

Show Detail

Format number on Y-axis of Google Chart

I have a web page that displays several Google Charts on a map - http://wa.water.usgs.gov/projects/puyallupgw/hydrographs.htm. On some of the charts, the numbers in the Y-axis have decimals. Can I ...

Show Detail

google chart double axis, set format

I have created a Google bar chart, with two x-axis. My problem is that I cannot seem to get the correct format on the bottom axis, which should be shown in percentage. I have tried to use the

Show Detail

data takes time to reflect in google gauge even though the data is loaded

I have written the below code , but the data takes time to reflect in google gauge even though the data is loaded and google gauge will sit set to 0 as initial values ! var url = 'http://san.gotdn...

Show Detail