谷歌图表：如何使动态组合图保持相同的选项 [英] Google Charts: How to keep options the same with dynamic combo chart

问题描述

我使用了以下代码 http://jsfiddle.net/asgallant/WaUu2/ 这使我可以在我的组合图中打开和关闭系列。我遇到的问题是我的组合图表同时使用了线型和杆型系列。当我从图表中打开和关闭系列时，会丢失我的系列类型设置。我将以下内容放在一起，以便将平均列保留为折线图，其余部分保留为条形图。 $ c> function setChartView（）{
var state = columnFilter.getState（）;
var row;
var view = {
columns：[0]，
};
var labels = [];
for（var i = 0; i< state.selectedValues.length; i ++）{
row = columnsTable.getFilteredRows（[{
column：1，
value：state .selectedValues [i]
}]）[0];
view.columns.push（columnsTable.getValue（row，0））;
labels.push（[columnsTable.getValue（row，0），columnsTable.getValue（row，1）]）;

//将索引排序为它们的原始顺序
labels.sort（function（a，b）{
return（a [0] - b [0]）;
}）;
view.columns.sort（function（a，b）{
return（a - b）;
}）;

chart.setView（view）;

for（var i = 0; i< labels.length; i ++）{
chart.setOption（'series。'+ i +'.type'，'bars'）;
if（labels [i] [1] =='Average'）{
chart.getOptions（）。series [i] .type ='line';
}
}

chart.draw（）;
}

google.visualization.events.addListener（columnFilter，'statechange'，setChartView）;

setChartView（）;
columnFilter.draw（）;

它似乎适用于我的特定情况，但是，如果我想保留所有的我

解决方案

尝试改变这个：

  for（var i = 0; i< view.columns.length; i ++）{
 var col = view.columns [i] 
 chart.setOption（'series。 '+ col +'.type'，'bars'）; 
 if（col == yourAverageColumnOriginalIndex）{
 chart.getOptions（）。series [col] .type ='line'; 
} 
} 
  

I've used the following code http://jsfiddle.net/asgallant/WaUu2/ which allows me to toggle on and off series from my combo chart. The issue I was having with it, is my combo chart used both line and bar series types. When I toggled series from the chart on and off I would lose my series type setting. I put together the following to keep my average column as a line chart and the rest as a bar chart.

function setChartView() {
    var state = columnFilter.getState();
    var row;
    var view = {
        columns: [0],
    };
    var labels = [];
    for (var i = 0; i < state.selectedValues.length; i++) {
        row = columnsTable.getFilteredRows([{
            column: 1,
            value: state.selectedValues[i]
        }])[0];
        view.columns.push(columnsTable.getValue(row, 0));
        labels.push([columnsTable.getValue(row, 0), columnsTable.getValue(row, 1)]);
    }
    // sort the indices into their original order
    labels.sort(function(a, b) {
        return (a[0] - b[0]);
    });
    view.columns.sort(function(a, b) {
        return (a - b);
    });

    chart.setView(view);

    for (var i = 0; i < labels.length; i++) {
        chart.setOption('series.' + i + '.type', 'bars');
        if (labels[i][1] == 'Average') {
            chart.getOptions().series[i].type = 'line';
        }
    }

    chart.draw();
}

google.visualization.events.addListener(columnFilter, 'statechange', setChartView);

setChartView();
columnFilter.draw();

It appears to be working for my specific case, however, what if I wanted to keep all of my options the same?

解决方案

Try changing this:

                  for(var i = 0; i < view.columns.length; i++){
                        var col = view.columns[i]
                        chart.setOption('series.' + col + '.type', 'bars');
                        if(col == yourAverageColumnOriginalIndex){
                            chart.getOptions().series[col].type = 'line';
                        }
                    }

这篇关于谷歌图表：如何使动态组合图保持相同的选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！