Google圖表：過濾GeoChart

Question

我正在嘗試使用ControlWrapper過濾數據以顯示在儀表板內的GeoChart上。 問題如下：我必須具有三列：“國家”，“值”和“季度”。 現在，我只想顯示四分之一的信息，這要歸功於CategoryPicker。 然后，我要使用儀表板功能，將選擇器與我的GeoChart綁定。 但是，我無法顯示我的GeoChart，因為它會引發錯誤，因為我使用了三列，而我應該只有兩列...

我知道訣竅是使用DataView並隱藏第三列，但隨后無法鏈接過濾器和我的地理圖表。

這里有解決方法嗎？ 我的部分代碼可以在下面找到。 順便說一句，這適用於其他類型的圖表，但不適用於GeoChart ...為什么？

預先，非常感謝您的幫助！

var data = response.getDataTable();

        var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard_div'));

        var quarterSelector = new google.visualization.ControlWrapper({
                'controlType': 'CategoryFilter',
                'containerId': 'filter_div',
                'options': {
                    'filterColumnLabel': 'Quarter',
                     ui: {
                        allowTyping: false,
                        allowMultiple: false,
                        allowNone: false
                    },
                    'chartView': {
                        'columns': [0,1]
                    },
                }
        });

        var mapChart = new google.visualization.ChartWrapper({
            'chartType': 'GeoChart',
            'containerId': 'regions_div',
            'options': {
                'displayMode': 'regions',
                'region': '150',
                'view': {'columns':[0,1]}
            }
        });         

    dashboard.bind(quarterSelector, mapChart);      
    dashboard.draw(data);

Answer 1

第一， chartView是部分ui上ChartRangeFilter -不CategoryFilter

此外， view: {'columns':[0,1]}不應該是options一部分
但與options ， chartType和containerId處於同一級別

但是，這里都不應該...

 google.charts.load('current', { packages: ['controls', 'geochart'], callback: drawChart }); function drawChart() { var data = google.visualization.arrayToDataTable([ ['Country', 'Popularity', 'Quarter'], ['Germany', 200, 1], ['United States', 300, 2], ['Brazil', 400, 3], ['Canada', 500, 4], ['France', 600, 3], ['RU', 700, 2] ]); var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard_div')); var quarterSelector = new google.visualization.ControlWrapper({ controlType: 'CategoryFilter', containerId: 'filter_div', options: { filterColumnLabel: 'Quarter', ui: { allowTyping: false, allowMultiple: false, allowNone: false } } }); var mapChart = new google.visualization.ChartWrapper({ chartType: 'GeoChart', containerId: 'regions_div', options: { displayMode: 'regions' } }); dashboard.bind(quarterSelector, mapChart); dashboard.draw(data); } 

 <script src="https://www.gstatic.com/charts/loader.js"></script> <script src="https://www.google.com/jsapi"></script> <div id="dashboard_div"> <div id="filter_div"></div> <div id="regions_div"></div> </div>