标签: google-visualization

如何在谷歌图表表中隐藏列

我有一个Google Charts Table,它显示了几列和一行.比如说我们有4列(分别是A,B,C,D).我怎么能够仍然加载列C的值,但只是隐藏列,以便它不会显示?

提前致谢!

html javascript google-visualization

15
推荐指数
1
解决办法
2万
查看次数

谷歌图表整数的垂直轴

我正在尝试配置Google柱形图以整数显示垂直轴,但是当它显示一个小数字(例如1)时,它也显示0.25,0.50等.

反正有改变吗?我一直在阅读文档,找不到任何相关的内容.

谢谢

google-visualization

15
推荐指数
2
解决办法
3万
查看次数

将参数传递给Google可视化中的回调函数

这就是谷歌可视化的例子.

google.load("visualization", "1", {packages:["table"], callback: drawVisualization});
Run Code Online (Sandbox Code Playgroud)

要么

google.load('visualization', '1', {'packages':['corechart']});
google.setOnLoadCallback(drawVisualization);
Run Code Online (Sandbox Code Playgroud)

如何将参数传递给回调函数drawVisualization?

javascript google-visualization

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

Google图表y轴值

我有一组配对数据:

[(x_1,y_1), (x_2,y_2), (x_3, y_3)] 
Run Code Online (Sandbox Code Playgroud)

并且我想XYChart使用python GChartWrapper库来制作它,使得y轴值是数据的转换.

一个简单的例子是具有上侧的实际值,对数曲线图,例如,如果y_1,y_2y_3代表log_10值,则图形将图表它们的方式,但是,从y轴上的标签可以是10^{y_1},10^{y_2},和10^{y_3}.

我试过玩chxr这个但是这不起作用,因为它不仅仅是轴上的标签改变了,而是整个轴.例如,如果我从上面有一个日志和我的y值是0,1,2.我想图表看起来相同,但标签改为10^0,10^1,10^2, 1,10,100.但是因为gchart想要保留比例,所以它会尝试将其转换为范围来自0 -> 100而不仅仅是更改标签.

我该怎么做呢?

python charts google-visualization

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

样式化Google图表表

我正在尝试将CS​​S样式添加到Google Charts表中.我试过这个:

https://developers.google.com/chart/interactive/docs/gallery/table#customproperties

在第一个单元格(迈克),但它没有工作.我在options变量中将allowHtml设置为true.如何更改单个单元格的背景,文本颜色等?谢谢.

<script type="text/javascript">
        google.load('visualization', '1', {packages:['table']});
        google.setOnLoadCallback(drawTable);
        function drawTable() {
            var data = new google.visualization.DataTable();
            data.addColumn('string', 'Employee Name');
            data.addColumn('date', 'Start Date');
            data.addRows(3);
            data.setCell(0, 0, 'Mike', {style: 'background-color:red;'});
            data.setCell(0, 1, new Date(2008, 1, 28));
            data.setCell(1, 0, 'Bob');
            data.setCell(1, 1, new Date(2007, 5, 1));
            data.setCell(2, 0, 'Alice');
            data.setCell(2, 1, new Date(2006, 7, 16));

            var options = {
                allowHtml: true
            };

            // Create a formatter.
            // This example uses object literal notation to define the options.
            var formatter = new …
Run Code Online (Sandbox Code Playgroud)

javascript google-visualization

14
推荐指数
1
解决办法
2万
查看次数

Google Charts信息中心 - 隐藏列

我使用谷歌图表仪表板来显示折线图,我想在运行时控制显示的元素.例如:

function drawVisualization() {
// Create and populate the data table.
var data = google.visualization.arrayToDataTable([
    ['x', 'Cats', 'Blanket 1', 'Blanket 2'],
    ['A',   1,       1,           0.5     ],
    ['B',   2,       0.5,         1       ],
    ['C',   4,       1,           0.5     ],
    ['D',   8,       0.5,         1       ],
    ['E',   7,       1,           0.5     ],
    ['F',   7,       0.5,         1       ],
    ['G',   8,       1,           0.5     ],
    ['H',   4,       0.5,         1       ],
    ['I',   2,       1,           0.5     ],
    ['J',   3.5,     0.5,         1       ],
    ['K',   3,       1,           0.5     ],
    ['L',   3.5,     0.5,         1 …
Run Code Online (Sandbox Code Playgroud)

javascript google-visualization

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

柱形图:如何在水平轴上显示所有标签

我一直试图在我的图表的水平轴上显示所有标签,但我无法做到这一点!

我尝试使用hAxis.showTextEvery = 1但不起作用

(请参阅https://developers.google.com/chart/interactive/docs/gallery/columnchart).

在此输入图像描述

基本上,我还想显示上图中目前缺少的数字"5","7"和"9".

这里是JavaScript代码,非常感谢.

<script type="text/javascript">
 google.setOnLoadCallback(drawChart1);
 function drawChart1(){
     var data = new google.visualization.DataTable(
     {
        "cols":[
            {"id":"","label":"ratings","type":"number"},
            {"id":"","label":"# of movies","type":"number"}],
            "rows":[
                {"c":[{"v":9},{"v":26}]},
                {"c":[{"v":8},{"v":64}]},
                {"c":[{"v":10},{"v":5}]},
                {"c":[{"v":7},{"v":50}]},
                {"c":[{"v":6},{"v":38}]},
                {"c":[{"v":5},{"v":10}]},
                {"c":[{"v":2},{"v":1}]},
                {"c":[{"v":4},{"v":1}]}
            ]});

     var options = {
        "title":"Rating distribution",
        "vAxis":{"title":"# of movies","minValue":0},
        "hAxis":{"title":"Ratings","maxValue":10},"legend":"none","is3D":true,"width":800,"height":400,"colors":["red"]
     };
     var chart = new google.visualization.ColumnChart(document.getElementById('chart_movies_per_rating'));chart.draw(data, options);
 }
 </script> 
Run Code Online (Sandbox Code Playgroud)

更新: 这是我开发的解决方案,遵循以下答案(再次感谢!). http://jsfiddle.net/mdt86/x8dafm9u/104/

<script type="text/javascript">
google.setOnLoadCallback(drawChart1); 
function drawChart1(){ 
var data = new google.visualization.DataTable( 
     {"cols": 
        [{"id":"","label":"ratings","type":"string"},
        {"id":"","label":"# of movies","type":"number"}], 
             "rows":
             [{"c":[{"v":"0"},{"v":0}]},
             {"c":[{"v":" 1"},{"v":0}]},
             {"c":[{"v":" …
Run Code Online (Sandbox Code Playgroud)

google-visualization

14
推荐指数
2
解决办法
4万
查看次数

TypeError:google.visualization未定义

我正在尝试使用Google图表API,但是我收到一个我无法理解的错误:

这是我的代码:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="js/statistics/overview.js"></script>
Run Code Online (Sandbox Code Playgroud)

来自overview.js的代码是这样的:

var statisticsOverview = {
    init: function() {
        google.load("visualization", "1", {packages: ["corechart"]});
        google.setOnLoadCallback(this.drawIncomeChart());
        google.setOnLoadCallback(this.drawExpensesChart());
        google.setOnLoadCallback(this.drawEconomiesChart());
    },
    drawIncomeChart: function() {
        var data = [
            ['Year', 'Income'],
            ['October 2013', 1000],
            ['January 2014', 1170],
            ['March 2014', 660]
        ];
        var options = {
            title: 'Income Performance',
            colors: ['green']
        };
        var id = 'chart_income';

        this.drawLineChart(data, options, id);
    },
    drawExpensesChart: function() {
        var data = [
            ['Year', 'Expense'],
            ['October 2013', 1000],
            ['January 2014', 1170],
            ['March 2014', 660]
        ]; …
Run Code Online (Sandbox Code Playgroud)

javascript google-visualization

14
推荐指数
1
解决办法
3万
查看次数

多行Google Tool Chart的工具提示

我想知道是否有人知道如何使用DataTable,addColumn和addRow使用Google Line Charts向多行数据添加工具提示?

我已经看到它使用其他方法完成了,但这在我的项目中相当困难,我觉得愚蠢,因为没有弄清楚这一点.无论如何,我已经愚弄了我的代码来介绍我的问题的基本要点.

如您所见,工具提示显示为第2行,但不显示第1行.我的问题是:如何使用此方法向第1行添加工具提示?我的代码:http: //jsfiddle.net/Qquse/550/

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('number', 'y');
        data.addColumn('number', 'Line 1');
        data.addColumn('number', 'Line 2');
        data.addColumn({type: 'string', role: 'tooltip'});
        data.addRow([1, 1, 2, "Some fancy tooltip"]);
        data.addRow([2, 2, 4, "Some fancy tooltip"]);
        data.addRow([3, 3, 6, "Some fancy tooltip"]);
        data.addRow([4, 4, 8, "Some fancy tooltip"]);
        data.addRow([5, 5, 10, "Some fancy tooltip"]);
        var options = {
            title: 'Graph'
        };

       var chart = new google.visualization.LineChart(document.getElementById('chart'));
       chart.draw(data, options);
    } …
Run Code Online (Sandbox Code Playgroud)

javascript charts linechart google-visualization

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

Rails chartkick堆积条形图

我正在尝试使用Rails Chartkick gem 创建堆积条形图,我正在使用Google图表API.

我使用此行使用chartkick生成条形图.

<%= bar_chart data, :library => {:isStacked => true} %> 
Run Code Online (Sandbox Code Playgroud)

但我得到的是一个简单的条形图而不是堆叠的条形图.我的问题是我应该传递给data参数的数据结构是什么.我试过传递一个数组,比如(来自谷歌图表样本)

[['Genre', 'Fantasy & Sci Fi', 'Romance', 'Mystery/Crime', 'General','Western', 'Literature', { role: 'annotation' } ],['2010', 10, 24, 20, 32, 18, 5, '']]
Run Code Online (Sandbox Code Playgroud)

但它不起作用.

charts ruby-on-rails google-visualization chartkick

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