Google Material Charts: Stop Tooltip Rounding

Question

I'm using the Google Visualisation Material Chart...

https://google-developers.appspot.com/chart/interactive/docs/gallery/barchart#Material

....and in my example...

http://jsfiddle.net/ETFairfax/78595a3h/

...the Tooltips are rounding the bar values rather than just displaying the values as they are.

I've tried customising the tooltips as documented here : https://developers.google.com/chart/interactive/docs/customizing_tooltip_content#custom_html_content but still no joy.

The documentation does say...

"The Material Charts are in beta."

so maybe I'm fighting a lost cause.

My question:

Does anyone know how to stop the tooltips from rounding?

Any help appreciated.

HTML

<div id="chart_div" style="width: 900px; height: 500px;"></div>

JS Code:

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

function drawChart() {
    var data = google.visualization.arrayToDataTable([
        ['Task', 'Hours per Day'],
        ['Work', 8.5], // Tooltip says 8.5. CORRECT
        ['Eat', 11.5], // Tooltip says 12 - INCORRECT
        ['Commute', 2],// Tooltip says 2 - CORRECT
        ['Watch TV', 0.28],// Tooltip says 0.28 - CORRECT
        ['Sleep', 7.28] // Tooltip says 7.3 - INCORRECT
    ]);

    var options = {
        title: 'My Daily Activities'
    };

    var chart = new google.charts.Bar(document.getElementById('chart_div'));

    chart.draw(data, google.charts.Bar.convertOptions(options));
}

Answer 1

You must specify a different format:

    var options = {
      title: 'My Daily Activities',
      vAxis : {
        format: 'decimal'
      }
    }

Answer can be found in this link: here