簡體   English   中英

Google Charts API根據控件選擇更改顏色

[英]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.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM