[英]Google Charts API change color based on control selection
我有一個谷歌圖表,我試圖根據類別控件更改顏色。
我的圖表是一個直方圖,應根據programmaticDropdown中的選擇更改顏色。 我的部分代碼如下所示:
var dashboard = new google.visualization.Dashboard(
document.getElementById('programmatic_dashboard_div'));
programmaticDropdown = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'programmatic_control_div',
'options': {
'filterColumnLabel': 'Type',
'ui': {'allowMultiple': false},
}
});
programmaticChart = new google.visualization.ChartWrapper({
'chartType': 'Histogram',
'containerId': 'programmatic_chart_div',
'options': {
'title': 'Issues by Month',
'legend': 'none',
'height':400,
'hAxis': {
'viewWindowMode':'explicit',
'viewWindow':{
'max':13,
'min':0
}
}
},
'view': { 'columns': [0, 1] }
});
dashboard.bind(programmaticDropdown, programmaticChart);
dashboard.draw(data);
}
另外,這是指向Google圖表控件文檔的鏈接,其中包含一些UI信息...任何人都可以幫忙嗎?
謝謝!!!
https://developers.google.com/chart/interactive/docs/gallery/controls?hl=en#controls-gallery
解決了!!! 為此,我必須在代碼中添加一個事件偵聽器和函數。 見下文。
google.visualization.events.addListener(programmaticDropdown,'statechange',changeTitle);
function changeTitle () {
var location = programmaticDropdown.getState().selectedValues[0];
if (location == "CLOSED") {
programmaticChart.setOption('colors', ['#e7711c']);
} else if (location == "OPEN") {
programmaticChart.setOption('colors', ['#ff0000']);
}
programmaticChart.draw();
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.