如何在任何选择方向上将Google可视化类别过滤器与所有过滤器绑定?

时间:2016-11-29 03:54:43

标签: charts google-visualization

我有三个类别过滤器,它具有顺时针方向的下拉选择。现在我需要将它绑定到任何方向。这意味着,如果我选择任何下拉列表,则其他2下拉列表应过滤其值。

代码适用于顺时针方向:

    var cblAnalyst = new google.visualization.ControlWrapper(
    {
        'controlType': 'CategoryFilter',
        'containerId': 'cblAnalyst',
        'options': {
            'filterColumnIndex': '0', 'ui': {
                'label': '', 'labelSeparator': ':', 'labelStacking': 'horizontal', 'allowTyping': false, 'allowNone': true, 'allowMultiple': false
            }
        }
    });

    var cblAdvocate = new google.visualization.ControlWrapper(
    {
        'controlType': 'CategoryFilter',
        'containerId': 'cblAdvocate',
        'options': {
            'filterColumnIndex': '1',
            'ui': { 'label': '', 'labelSeparator': ':', 'labelStacking': 'horizontal', 'allowTyping': false, 'allowNone': true, 'allowMultiple': false }
        }
    });

    var cblProductNames = new google.visualization.ControlWrapper(
    {
        'controlType': 'CategoryFilter',
        'containerId': 'cblProductNames',
        'options': {
            'filterColumnIndex': '7',
            'ui': { 'label': '', 'labelSeparator': ':', 'labelStacking': 'horizontal', 'allowTyping': false, 'allowNone': true, 'allowMultiple': false }
        }
    });

    var tblSearchFilters = new google.visualization.ChartWrapper({
        'chartType': 'Table',
        'containerId': 'tblSearchFilters',
        'options': {
            'allowHtml': true, 'showRowNumber': true, 'page': 'enable', 'pageSize': 10,
            width: '100%'
        }
    });

    new google.visualization.Dashboard(document.getElementById('dashboard'))
        .bind(cblAnalyst, cblAdvocate)
        .bind(cblAdvocate, cblProductNames)
        .bind(cblProductNames, tblSearchFilters)
        .draw(dtSearchFilters);

绘制的类别过滤器:

enter image description here

寻找解决方案:

我应该能够在选择产品时过滤分析师和倡导者。

编辑:

示例数据:

Filter 1    Filter 2    Filter 3 (Apply filter here)
AN - 1  AD - 1  PD - 1
AN - 1  AD - 1  PD - 2
AN - 1  AD - 2  PD - 3
AN - 2  AD - 3  PD - 4
AN - 2  AD - 4  PD - 5

将其复制到Excel电子表格中并按规定应用过滤器。

1 个答案:

答案 0 :(得分:1)

如果没有一个实际的例子,这个问题很难理解

通常,当将多个控件绑定到相同的图表时,
只需要一次bind电话

new google.visualization.Dashboard(document.getElementById('dashboard'))
    .bind([cblAnalyst, cblAdvocate, cblProductNames], tblSearchFilters)
    .draw(dtSearchFilters);

这将使所有过滤器与表格保持同步

例如,如果选择了产品,则 只有与该产品相关的剩余分析师倡导者才能在过滤器中使用