使用Google Sheet的Google可视化折线图代码示例
我正在寻找使用谷歌表作为源数据的示例代码，并使用谷歌可视化制作了一个相当简单的折线图。
我注意到新的谷歌表没有在“共享图表”功能中包含脚本，它们提供了IFRAME，宽度/高度也不起作用。所以，我希望用谷歌可视化来做这件事。
谢谢你的帮助。
编辑...
这是我的电子表格。
这是我的HTML文件。
<html>
<head>
<script type="text/javascript">
function drawChart() {
var query = new google.visualization.Query('http://docs.google.com/spreadsheet/tq?key=14MXilv-uhEAUxDzVB7qVCCmQYqkmWvqqaBOXeBsS04k&gid=0');
query.setQuery('SELECT A, B, C, D, E');
query.send(function (response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
return;
}
var data = response.getDataTable();
var chart = new google.visualization.LineChart(document.querySelector('linechart'));
chart.draw(data, {
height: 400,
width: 600
});
});
}
google.load('visualization', '1', {
packages: ['corechart'],
callback: drawChart
});
</script>
<title>Data from a Spreadsheet</title>
</head>
<body>
<span id="linechart"></span>
</body>
</html>
它不画。我尝试了电子表格中的各种选择，比如避免列A，不去。我做错了什么？
共有1个答案
下面是一些让您开始的示例代码：
function drawChart() {
var query = new google.visualization.Query('http://docs.google.com/spreadsheet/tq?key={spreadsheet key}&gid=0');
query.setQuery('SELECT A, B, C');
query.send(function (response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
return;
}
var data = response.getDataTable();
var chart = new google.visualization.LineChart(document.querySelector('#chart_div'));
chart.draw(data, {
height: 400,
width: 600
});
});
}
google.load('visualization', '1', {packages:['corechart'], callback: drawChart});
在页面的HTML中，需要有一个与创建图表时使用的ID相匹配的容器div（本例中为'chart_div'):
<div id="chart_div"></div>
-
本文向大家介绍pytorch 可视化feature map的示例代码，包括了pytorch 可视化feature map的示例代码的使用技巧和注意事项，需要的朋友参考一下 之前做的一些项目中涉及到feature map 可视化的问题，一个层中feature map的数量往往就是当前层out_channels的值，我们可以通过以下代码可视化自己网络中某层的feature map，个人感觉可视化fea
-
折线图用于绘制基于折线的图表。在本节中，我们将讨论以下类型的基于折线的图表。 图表类型 描述 基本折线图 基本折线图 带点折线图 带点折线图 定制背景色折线图 带有自定义背景颜色的图表。 定制线条颜色折线图 带有自定义线条颜色的图表。 定制轴和刻度标签折线图 带有自定义轴和刻度标签的图表。 带十字准线折线图 折线图在选择的数据点处显示十字准线。 定制线条样式折线图 带有自定义线条颜色的图表。 带曲
-
如何在悬停时以百分比形式显示数据？我可以让网格线显示百分比，但悬停始终显示未格式化的数据：vs。
-
问题内容： 我正在使用Google Visualization为我的应用程序创建折线图。我有以下要求： 处理图例事件（例如doubleClick，我已通过某种方式解决了该事件） 将图例两行包装以避免分页（大多数imp和必填项） 问题答案： 示例：构建自定义图例，该图例与数据和图表同步…
-
问题内容： 我正在尝试使用Google路线API在我的地图视图上显示路线，但是我很难从JSON响应中获取数据。我可以获取“级别”和“点”字符串，但无法弄清楚如何将它们解码为地图上的点。 任何帮助将非常感激。 问题答案： 我有一个可以为您解码它们的类，在下面添加该类，然后像这样调用您的代码： 您从JSON响应中提取的数据在哪里和。然后，您可以遍历一系列地理点，在它们之间画一条线以显示方向。 希望这可
-
我正在尝试创建一个双轴甘特图和折线图，以在左轴上显示任务（甘特图数据），在右轴上显示数值（折线图数据）。我想使用谷歌图表、高图或chartJs进行可视化，但不知道哪一个可以实现，请参阅我试图接近的视觉对象的问题所附的链接/图片。我可以单独显示每个图表，但不能作为组合的双轴图表一起显示。我已经尝试了各种组合图表配置，但没有任何东西接近工作。对此的任何帮助都将不胜感激。 以下是谷歌图表、HighCha