我希望模仿标准的谷歌可视化表标题行行为,但它适用于第一列.这似乎不是一个内置功能,但我想知道它是否可以通过一些自定义CSS完成?
我正在尝试通过Google Charts API实现带注释的时间线图表.我成功地使用AJAX调用从数据库加载数据,但是我注意到虽然注释显示在右侧,但它们不会出现在图形上的点之上(如工具提示).然而,他们工作得很好,我可以点击它们甚至正确包含Annotation过滤器.
在一两个小时左右没有看到任何错误后,我决定回到绘图板并从Google API中获取图表示例代码的精确副本并进行测试.事实证明我遇到了同样的问题.
本教程的链接在这里(注意A和B如何显示在图表本身上),我还粘贴了下面的代码.
是否有一些我缺少的设置或阻止这种情况的东西?我在Chrome和Firefox中测试过,但都没有用.它也适用于我的教程页面,所以我很茫然.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Google Charts Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type='text/javascript'>
google.load('visualization', '1', {'packages':['annotatedtimeline']});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'Sold Pencils');
data.addColumn('string', 'title1');
data.addColumn('string', 'text1');
data.addColumn('number', 'Sold Pens');
data.addColumn('string', 'title2');
data.addColumn('string', 'text2');
data.addRows([
[new Date(2008, 1 ,1), 30000, undefined, undefined, 40645, undefined, undefined],
[new Date(2008, 1 ,2), 14045, undefined, undefined, 20374, undefined, undefined],
[new Date(2008, 1 ,3), 55022, …Run Code Online (Sandbox Code Playgroud) 有没有办法计算谷歌可视化API表格中的列的总和.例如,在MS Excel中,有一个自动求和功能来计算列的总和.谢谢.
我是PHP和Google图表的新手.我想用它来制作谷歌图表与arduino数据存储在MYSL数据库中.到目前为止,我成功地将数据从arduino插入到mysql数据库,但我遇到了谷歌图表的困难.
这是我的PHP代码:
<?php
$mysqli =mysqli_connect('localhost', 'root', '', 'Arduino');
if (mysqli_connect_errno()) {
echo "Failed to connect to MySQL: ".mysqli_connect_error();
}
$sql = mysqli_query($mysqli, 'SELECT * FROM analoog0');
if (!$sql) {
die("Error running $sql: " . mysql_error());
}
$results = array();
while($row = mysqli_fetch_assoc($sql))
{
$results[] = array(
'Date' => $row['Date'],
'Time' => $row['Time'],
'Temperature' => $row['Temperature']
);
}
$json = json_encode($results, JSON_PRETTY_PRINT);
echo $json;
?>
Run Code Online (Sandbox Code Playgroud)
这是JSON输出:
[ { "Date": "2013-10-24", "Time": "18:15:49", "Temperature": "24" },
{ "Date": "2013-10-24", "Time": "18:16:19", "Temperature": …Run Code Online (Sandbox Code Playgroud) 我需要在x轴上显示每个日期.使用以下代码.单个日期也有多个值.
现在我得到随机日期显示在x轴上.但我需要在x轴上显示每个日期.
[NSString *htmlString = \[NSString stringWithFormat:@"<html>\
<head>\
<script type=\"text/javascript\" src=\"https://www.google.com/jsapi\"></script>\
<script type=\"text/javascript\">\
google.load(\"visualization\", \"1\", {packages:\[\"corechart\"\], 'language': 'en'});\
google.setOnLoadCallback(drawChart);\
function drawChart() {\
var dataTable = new google.visualization.DataTable();\
dataTable.addColumn('datetime', 'Voltage (V)');\
dataTable.addColumn('number', 'Current (mA.)');\
\
dataTable.addRows(\[\
\[new Date(2008, 1, 1), 10\],\
\[new Date(2008, 1, 2), 6\],\
\[new Date(2008, 1, 2), 15\],\
\[new Date(2008, 1, 2), 10\],\
\[new Date(2008, 1, 2), 19\],\
\[new Date(2008, 1, 3), 12\],\
\[new Date(2008, 1, 4), 22\],\
\[new Date(2008, 1, 4), 15\],\
\[new Date(2008, 1, 5), 25\],\ …Run Code Online (Sandbox Code Playgroud) 我想为Google条形图中的每一列指定一种特定的颜色.我想知道这样做最好的方法是什么.我想在每个数据点都包含一个颜色十六进制代码.
我有一个jsfiddle:http: //jsfiddle.net/zYS27/
var option = {
animation: {duration: 1000, easing: 'out',},
hAxis: {textStyle:{
fontName: 'Nunito',fontSize: '16' }},
legend: { position: "none" },
tooltip: {trigger: "none", textStyle:{
fontName: 'Nunito',fontSize: '16' }, isHtml: true},
bar: {groupWidth: "80%"},
vAxis: {format:'0%', minValue:0, viewWindowMode:'maximized', textStyle:{
fontName: 'Nunito',fontSize: '16' }, maxValue:1},
};
var formatter = new google.visualization.NumberFormat({
fractionDigits: 3,
pattern:'#,###%',
});
var data = new google.visualization.DataTable();
data.addColumn('string', 'N');
data.addColumn('number', 'Value');
data.addRow(['Orange', 0]);
data.addRow(['Red', 0]);
data.addRow(['Green', 0]);
data.addRow(['Blue', 0]);
data.addRow(['Purple', 0]);
// Create and …Run Code Online (Sandbox Code Playgroud) 我想在图例中显示鼠标悬停时切片的工具提示.默认情况下,仅当鼠标位于饼图切片上时才显示工具提示.
目前我最接近的是当我点击图例时显示工具提示,其中:
tooltip: { trigger: 'selection' }
Run Code Online (Sandbox Code Playgroud)
当我绘制图表时作为选项.
我试图在参考中找到一些没有结果的东西.
JSFiddle:http://jsfiddle.net/ohavpo17/2/
charts legend google-visualization mousehover legend-properties
我想将3个独立的数据集解析为我的chart.draw()函数.我已经读过这是不可能的,所以我必须使用google.visualization.data.join()函数将它们连接在一起.我似乎无法加入3个json字符串.我试过这个(因为该函数只需要两个变量):
var joinedData1 = google.visualization.data.join(json1, json2, 'full', [[0, 0]], [1], [1]);
var joinedData2 = google.visualization.data.join(joinedData1, json3, 'full', [[0, 0]], [1], [1]);
Run Code Online (Sandbox Code Playgroud)
但是当我绘制图表时,似乎只绘制了"json1"和"json3"的行.
如何从单独的数据集中绘制3条线?
任何帮助将非常感激.
我有一个包含分类数据列的大型电子表格.我想为每列创建一个条形图,表示该列中不同值的计数.我尝试使用Google Apps脚本自动完成此过程,但我得到的结果非常错误.
这是我正在使用的代码
function myFunction() {
var responseSpreadSheet = SpreadsheetApp.openByUrl("https://mySpreadsheetLink")
.getActiveSheet();
Logger.log(responseSpreadSheet.getName());
var titles = responseSpreadSheet.getRange(1, 4, 1, 25).getValues();
var barChart = responseSpreadSheet.newChart()
.setChartType(Charts.ChartType.BAR)
.setOption('title', titles[0][0])
.addRange(responseSpreadSheet.getRange("D2:D57"))
.setPosition(5, 5, 0,0)
.build();
responseSpreadSheet.insertChart(barChart);
}
Run Code Online (Sandbox Code Playgroud)
这是带有嵌入式条形图的电子表格:
并且期望的结果将是这样
如何在列上创建此类图表?
我通过使用此代码填充我的谷歌的数据表
$.ajax({
url: "Default2.aspx/GetChartData",
data: "",
dataType: "json",
type: "POST",
contentType: "application/json; chartset=utf-8",
success: function (data) {
chartData = data.d;
},
error: function () {
alert("Error loading data! Please try again.");
}
}).done(function () {
google.charts.setOnLoadCallback(drawChart);
});
function drawChart() {
var data = google.visualization.arrayToDataTable(chartData);
Run Code Online (Sandbox Code Playgroud)
现在,我想基于一些过滤器删除行,这些过滤器会检查数据表行中的特定值(日期)。但是问题是文档中没有任何方法可以使用行元素。
javascript ×4
charts ×2
html ×2
annotations ×1
css ×1
datatable ×1
graph ×1
ios ×1
jquery ×1
json ×1
legend ×1
mousehover ×1
mysql ×1
php ×1