谷歌图表,如何在ChartWrapper中设置计算视图

Google Charts, how can i set a calculated view in a ChartWrapper?

本文关键字:ChartWrapper 设置 计算 视图 谷歌      更新时间:2023-09-26

我使用谷歌图表中的ChartWrapper。。我的实际实现是这样的:

var dataTable=new google.visualization.DataTable(DATA);
var options = {
                 title: 'Name of the Chart',
                 vAxis: {title: "Cups"},
                 hAxis: {title: "Month"},
                 isStacked: false,
                 pointSize: 3
             }; 
var chartWrapperArgs = {
                     chartType: "LineChart",
                     dataTable: dataTable,
                     view: {"columns":[0,1,2]},
                     options: options,
                     containerId: "chart"]
                 }; 
var chartWrapper = new google.visualization.ChartWrapper(chartWrapperArgs);
chartWrapper.draw();

问题是,有时我必须将数据类型从"日期"更改为"字符串",我在旧的实现中(没有ChartWrapper(这样做:

var dataView = new google.visualization.DataView(dataTable);
                dataView.setColumns([{
                    type: 'string',
                    label: dataView.getColumnLabel(0),
                    calc: function (dt, row) {
                        return dt.getFormattedValue(row, 0);
                    }
                }, 1]);

这是有效的,现在我已经在我的ChartWrapper实现中尝试了同样的方法,但没有成功:

我试过这两种方法:

1.(var dataTable=新google.visionation.dataTable(DATA(;

var chartWrapperArgs = {
                    chartType: "LineChart",
                    dataTable: dataTable,
                    view: {"columns":[
                    {
                        type: 'string',
                        label: dataTable.getColumnLabel(0),
                        calc: function (dt, row) {
                            return dt.getFormattedValue(row, 0);
                        }
                    },
                    1
                ]},
                    options: options,
                    containerId: "chart"]
                };
var chartWrapper = new google.visualization.ChartWrapper(chartWrapperArgs);

我的第二个:

var dataTable=new google.visualization.DataTable(DATA);
var dataView = new google.visualization.DataView(dataTable);
                dataView.setColumns([{
                    type: 'string',
                    label: dataView.getColumnLabel(0),
                    calc: function (dt, row) {
                        return dt.getFormattedValue(row, 0);
                    }
                }, 1]);
                var ViewData= dataView.toJSON();

var chartWrapperArgs = {
                    chartType: "LineChart",
                    dataTable: dataTable,
                    view: ViewData,
                    options: options,
                    containerId: "chart"]
                };
var chartWrapper = new google.visualization.ChartWrapper(chartWrapperArgs);

但这也没有奏效。。

我做错了什么?

我知道我可以像"dataTable:view"那样直接将视图设置为dataTable,但我只想在"view:"选项或chartWrapper.setView((选项中这样做。。还是这不可能?

您的第一个方法(设置view参数(应该可以工作,但您的代码在containerId: "chart"]行的末尾出现语法错误(]不应该存在(:

var chartWrapperArgs = {
    chartType: "LineChart",
    dataTable: dataTable,
    view: {
        columns: [{
            type: 'string',
            label: dataTable.getColumnLabel(0),
            calc: function (dt, row) {
                return dt.getFormattedValue(row, 0);
            }
        }, 1]
    },
    options: options,
    containerId: "chart"
};
var chartWrapper = new google.visualization.ChartWrapper(chartWrapperArgs);

如果这不起作用,你能发布一个完整的例子来演示这个问题吗?