Search code examples
javascriptphpgoogle-visualizationtooltipnumber-formatting

Changing the number format in google charts graphs of the Tooltip Data and also Y Axis


I need to add a comma after every thousand in my tooltip data (Y axis) and also in my Y axis. How do I go about changing the number format? I tried adding it in my codes but seems like it is not working. My vAxis and hAxis title display is also not working.

var options = {
  title:'<?php echo $row["$graph_title"];?>',
  height: 'auto',
  width : 'auto',
  tooltip : {trigger: 'selection'},
  is3D: true,
  vAxis: {title: '<?php echo $row1["$y_axis"]; ?>'},
  hAxis: {title: '<?php echo $row1["$x_axis"]; ?>'},
  bar: {groupWidth: "70%"},
  vAxis: {format:'decimal'}
};

Solution

  • You'd go ahead with a numberFormat. The docmentation describes it as

    Describes how numeric columns should be formatted. Formatting options include specifying a prefix symbol (such as a dollar sign) or the punctuation to use as a thousands marker.

    var numberFormat = new google.visualization.NumberFormat({
        groupingSymbol: ','
    });
    numberFormat.format(data, COLUMNNUMBER);