Google Sheets Annotated Timeline display exact values?

Question

I am clueless. I have done some research on how to display exact values on the y-axis and on top of the graph, and found the following:

Display exact values?

Determines whether to display a shortened, rounded version of the values on the top of the graph, to save space; false indicates that it may. Click on the pull-down menu to the right to view and choose a value. For example, if set to false, > 56123.45 might be displayed as 56.12k.

I can neither find such "pull-down menu" nor any other settings for displaying an exact value instead of the rounded version. I know this is possible when using the script externally and building your graph using the google script library, but my data is within a sheet which means I am creating the graph using Google Drive not a webstie and the values to be displayed are bigger than 1000. I gave this little importance until I realized that when I hover over the chart although the lines go up and down (for bigger and smaller values respectivaly) the value displayed on top of the chart for most of the points are the same given that they vary by decimals.

I tried dividing the values by 1000 and displaying them in decimal form with a suffix which will say "units (x1000)" but the effect is still the same, they are rounded to 2 dp.

I also tried to change the format of the cells which contain the values and nothing happened. Is there a specific way or method to use this "Display exact values?" within Google Drive? Is there any settings I have missed out on? I am also open to using google script if there is any code which will change the settings of the chart to fully display the values.

Best regards!!

Would you like to have the link for the entire document, the sheet or only the graph? @Sandy Good — Ava Barbilla, Mar 18 '15 at 02:25
You quoted something from some documentation it looks like. Wanted to see that. Can you get a screen shot, or snip of the screen, to show an image of the chart? (Don't know how many points you need to insert an image) — Alan Wells, Mar 18 '15 at 02:46
Here is the link: [link](developers.google.com/chart/interactive/docs/gallery/annotationchart)The information — Ava Barbilla, Mar 18 '15 at 02:59
Sorry, I typed enter by mistake. The information is down below at configuration options. — Ava Barbilla, Mar 18 '15 at 03:00
I do see **part** of that quote in the [configurations options](https://developers.google.com/chart/interactive/docs/gallery/annotationchart#Configuration_Options). But I don't see the quote about the pull-down menu. — Alan Wells, Mar 18 '15 at 04:53

score 1 · Accepted Answer · answered Mar 18 '15 at 04:52

I found the solution. Since there is no way to display exact values within Google Drive, or no method I know of nor am familiar with, what I did was I used google script do make a query which pulls the data from the sheet. Where do I place this chart and how? I use a localhost to display the chart locally on my computer which is a workaround to Google Drive. I used the following code:

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1','packages':['annotationchart']}]}"></script>
    <script type='text/javascript'>
      google.load('visualization', '1', {
          'packages': ['annotationchart']
      });
      google.setOnLoadCallback(drawChart);

      function drawChart() {
          var query = new google.visualization.Query(
              'URL&gid=1800788428&range=B:C'); // Note that here the URL stands for the link of the sheet which can be obtained by sharing the document.
          query.send(handleQueryResponse);
      }

      function handleQueryResponse(response) {
          if (response.isError()) {
              alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
              return;
          }

          var data = response.getDataTable();
          var chart = new google.visualization.AnnotationChart(document.getElementById('chart_div'));

          var options = {
              displayAnnotations: true
          };

          chart.draw(data, options);
      }
    </script>
  </head>

  <body>
    <div id='chart_div' style='width: 900px; height: 500px;'></div>
  </body>
</html>

The part of adding the URL to run the query was a bit tricky. Once you publish the document (done from the right top corner), you can copy a link from the pop-up which is basically the same as the one from the browser but has this extra criteria "?usp=sharing". Then you tell the query which sheet to go to which is the "gid" part; copy the gid numbers from the browser link into the sharing link. Lastly, to tell the query which range to select by simply placing &range= at the end followed by the desired columns and rows. This will create an Annotation Chart which by default comes with the option Display Exact Values. If for some reason, the values are still rounded you can add the following code:

          var options = {
              displayAnnotations: true
              displayExactValues: true
          };

For further documentation see:

https://developers.google.com/chart/interactive/docs/spreadsheets

For info on query

https://developers.google.com/chart/interactive/docs/gallery/annotationchart

For info on creating an Annotation Chart

Google Sheets Annotated Timeline display exact values?

1 Answers1