标签: google-visualization

是否有办法让Google可视化表格中最左边的列在侧滚时保持固定?

我希望模仿标准的谷歌可视化表标题行行为,但它适用于第一列.这似乎不是一个内置功能,但我想知道它是否可以通过一些自定义CSS完成?

javascript css jquery google-visualization

1
推荐指数
1
解决办法
1316
查看次数

Google图表带注释的时间线提示未显示

我正在尝试通过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)

html javascript annotations google-visualization

1
推荐指数
1
解决办法
3432
查看次数

谷歌可视化API列的总和

有没有办法计算谷歌可视化API表格中的列的总和.例如,在MS Excel中,有一个自动求和功能来计算列的总和.谢谢.

javascript google-visualization

1
推荐指数
1
解决办法
2915
查看次数

谷歌图表和MYSQL

我是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)

html php mysql google-visualization

1
推荐指数
1
解决办法
8907
查看次数

如何使用google graph api在iOS中显示x轴上的所有值

我需要在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)

charts graph google-visualization ios

1
推荐指数
1
解决办法
2408
查看次数

将颜色分配给Google Charts中的特定列

我想为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)

javascript google-visualization

1
推荐指数
1
解决办法
5668
查看次数

如何在图例悬停时在Google饼图上显示工具提示?

我想在图例中显示鼠标悬停时切片的工具提示.默认情况下,仅当鼠标位于饼图切片上时才显示工具提示.

目前我最接近的是当我点击图例时显示工具提示,其中:

tooltip: { trigger: 'selection' }
Run Code Online (Sandbox Code Playgroud)

当我绘制图表时作为选项.

我试图在参考中找到一些没有结果的东西.

JSFiddle:http://jsfiddle.net/ohavpo17/2/

charts legend google-visualization mousehover legend-properties

1
推荐指数
1
解决办法
4985
查看次数

Google chart api - 使用google.visualization.data.join加入3个json字符串

我想将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条线?

任何帮助将非常感激.

json google-visualization

1
推荐指数
1
解决办法
753
查看次数

从电子表格数据的单列制作条形图

我有一个包含分类数据列的大型电子表格.我想为每列创建一个条形图,表示该列中不同值的计数.我尝试使用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)

这是带有嵌入式条形图的电子表格:

嵌入式条形图

并且期望的结果将是这样

期望的结果

如何在列上创建此类图表?

google-visualization google-sheets google-apps-script

1
推荐指数
1
解决办法
1407
查看次数

我需要过滤Google图表中使用的google.visualization.datatable中的元素

我通过使用此代码填充我的谷歌的数据表

$.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)

现在,我想基于一些过滤器删除行,这些过滤器会检查数据表行中的特定值(日期)。但是问题是文档中没有任何方法可以使用行元素。

datatable google-visualization

1
推荐指数
1
解决办法
4100
查看次数