通過lagenda商品過濾Google圖表

我用Google圖表製作了圖表，我想應用一些過濾器。我發現如何按照行（圖表下方的主題）過濾圖形，但不是按照圖例顯示的列（pete，john，carl，andrea）過濾圖形。通過lagenda商品過濾Google圖表

查看的jsfiddle 我圖http://jsfiddle.net/fcqeA/

//Filtering subjects: 
var compPicker = new google.visualization.ControlWrapper({ 
    'controlType': 'CategoryFilter', 
    'containerId': 'control2', 
    'options': { 
    'filterColumnLabel': 'Subject', 
    'ui': { 
     'labelStacking': 'vertical', 
     'allowTyping': false, 
     'allowMultiple': true 
    } 
    } 
});

但現在通古斯項目...... 我覺得我忽略了的東西，但我真的無法找到它...我希望我的問題是清楚的

來源

2012-09-18 Gijs

終於找到了一種方法，以爲會有一個更簡單的方法，但莫比不

// Place graph 
var drawChart = new google.visualization.Dashboard(document.getElementById('dashboard')).bind([compPicker], [chart, table]);; 
drawChart.draw(data); 

// Filter respondents 
document.getElementById('names').onchange = function(evt) { 
if (evt.target.selectedIndex == 0) { 
    // Expectancy 
    chart.setView({'columns': [0,1,2,3,4]}); 
    chart.setOption('colors', ["#FFC000","#00b0f0","#ff0000","#92d050"]); 
} else if (evt.target.selectedIndex == 1) { 
    chart.setView({'columns': [0,1]}); 
    chart.setOption('colors', ["#FFC000"]); 
} else if (evt.target.selectedIndex == 2) { 
    chart.setView({'columns': [0,2]}); 
    chart.setOption('colors', ["#00b0f0"]); 
} else if (evt.target.selectedIndex == 3) { 
    chart.setView({'columns': [0,3]}); 
    chart.setOption('colors', ["#ff0000"]); 
} else if (evt.target.selectedIndex == 4) { 
    chart.setView({'columns': [0,4]}); 
    chart.setOption('colors', ["#92d050"]); 
} else { 
    chart.setView({'columns': [0,1,2,3,4]}); 
    chart.setOption('colors', ["#FFC000","#00b0f0","#ff0000","#92d050"]);  
} 
drawChart.draw(data); 
}; 

<select id="names"> 
    <option value="all">all</option> 
    <option value="pete">pete</option> 
    <option value="john">john</option> 
    <option value="carl">carl</option> 
    <option value="andrea">andrea</option> 
</select>

完整的代碼和示例

來源

2012-09-18 13:59:36 Gijs

通過lagenda商品過濾Google圖表

回答

相關問題