Question

我有一个示例fiddle here，其中Google可视化类别过滤器控件创建为

  var countryPicker = new google.visualization.ControlWrapper({
          'controlType': 'CategoryFilter',
          'containerId': 'control1',
          'options': {
            'filterColumnIndex': 0,
            'ui': {
              'labelStacking': 'vertical',
              'allowTyping': false,
              'allowMultiple': false
            }
          }
        });

        var regionPicker = new google.visualization.ControlWrapper({
          'controlType': 'CategoryFilter',
          'containerId': 'control2',
          'options': {
            'filterColumnIndex': 1,
            'ui': {
              'labelStacking': 'vertical',
              'allowTyping': false,
              'allowMultiple': false
            }
          }
        });

        var cityPicker = new google.visualization.ControlWrapper({
          'controlType': 'CategoryFilter',
          'containerId': 'control3',
          'options': {
            'filterColumnIndex': 2,
            'ui': {
              'labelStacking': 'vertical',
              'allowTyping': false,
              'allowMultiple': false
            }
          }
        });

这里我们可以任意组合选择过滤器。但是，如果我直接在CityPicker控件中选择 Albany ，那么我怎样才能获得其父级的值（即{strong> USA 的值来自{{ 1}}和特定城市所属的值{strong>纽约）{/ p>

Answer 1

您可以使用statechange事件处理程序获取当前城市，然后按城市过滤DataTable以获取与该城市对应的区域和国家/地区组合。这是一个例子：

google.visualization.events.addListener(cityPicker, 'statechange', function () {
    var state = cityPicker.getState();
    if (state.selectedValues.length) {
        // there is a selected city
        // since you set allowMultiple to false, there can be only one, so it is safe to do this:
        var city = state.selectedValues[0];
        var rows = data.getFilteredRows([{column: 2, value: city}]);
        // parse the rows for all country/region/state combos
        var regionsCountries = [];
        var comboChecker = {};
        for (var i = 0; i < rows.length; i++) {
            var country = data.getValue(rows[i], 0);
            var region = data.getValue(rows[i], 1);
            // the comboChecker makes sure we don't add a region/country combo more than once to the data set
            if (!comboChecker[region + country]) {
                comboChecker[region + country] = true;
                regionsCountries.push({region: region, country: country});
            }
        }
        // do something with regionsCountries
    }
});

请参阅此处的工作示例：http://jsfiddle.net/asgallant/KLhD3/1/

在Google可视化CategoryFilter中获取父控件的值

1 个答案: