javascript - Google Sheets 带注释的时间线显示精确值?

标签 javascript google-apps-script google-sheets google-visualization annotatedtimeline

我一无所知。我对如何在 y 轴和图表顶部显示精确值进行了一些研究,发现了以下内容:

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.

我既找不到这样的“下拉菜单”,也找不到任何其他用于显示精确值而不是舍入版本的设置。我知道在外部使用脚本并使用 google 脚本库构建图表时这是可能的,但我的数据位于工作表中,这意味着我使用 Google Drive 而不是 webstie 创建图表,并且要显示的值大于 1000我不太重视这一点,直到我意识到,当我将鼠标悬停在图表上时,尽管线条向上和向下(分别针对较大和较小的值),但图表顶部显示的大多数点的值是相同的,因为它们因小数点而异。

我尝试将这些值除以 1000 并以十进制形式显示,并带有后缀“单位 (x1000)”,但效果仍然相同,它们四舍五入为 2 dp。

我还尝试更改包含值的单元格的格式,但没有任何反应。是否有特定的方式或方法可以在 Google 云端硬盘中使用此“显示精确值?”?是否有我错过的设置?如果有任何代码可以更改图表的设置以完全显示值,我也愿意使用谷歌脚本。

最诚挚的问候!!

最佳答案

我找到了解决方案。由于无法在 Google Drive 中显示准确的值,或者没有我知道或熟悉的方法,所以我所做的是使用 google script 进行查询,从工作表中提取数据。我将该图表放在哪里以及如何放置?我使用本地主机在我的计算机上本地显示图表,这是 Google Drive 的解决方法。我使用了以下代码:

<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>

添加 URL 来运行查询的部分有点棘手。发布文档(从右上角完成)后,您可以从弹出窗口复制一个链接,该链接与浏览器中的链接基本相同,但有一个额外的条件“?usp=sharing”。然后告诉查询要转到哪个工作表,哪个工作表是“gid”部分;将浏览器链接中的 gid 编号复制到共享链接中。最后,只需将 &range= 放在末尾,后跟所需的列和行,即可告诉查询选择哪个范围。这将创建一个注释图表,默认情况下带有选项显示精确值。如果由于某种原因,值仍然四舍五入,您可以添加以下代码:

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

有关更多文档,请参阅:

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

  • 有关查询的信息

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

  • 有关创建注释图表的信息

关于javascript - Google Sheets 带注释的时间线显示精确值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29111293/

相关文章:

javascript - 随机放置div而不覆盖

javascript - 设置文本宽度或将文本放入 div 中

javascript - jquery如何刷新数据表列表?

json - 如何将 JSON 响应转换为工作表中的表格

javascript - 如何在电子表格中按列检索数据

google-sheets - 查询并转置一长行数据 Google Sheets

javascript - 在运行时创建的组件中传播 viewModel

google-apps-script - 如何获得文档一部分的链接(标题,段落,部分......)

javascript - 如何将表单数据传递给GAS

google-apps-script - 谷歌脚本: How to implement conditional formatting into spreadsheet