使用Google Chart API控制板无法使用getFilteredRows [英] Having trouble with getFilteredRows using Google Chart API dashboard

问题描述

我正在组建一个仪表板，并试图做一些应该直截了当的事情。将有控制过滤器在仪表板级别上运行，但我还需要指定一些额外的过滤器（静态，而不是通过控件）到一个表。 getFilteredRows的方法似乎是答案，但它不起作用。

I'm putting together a dashboard and trying to do something that should be straight-forward. There will be Control Filters to operate at the dashboard level, but I also need to specify some additional filters (static, not through a control) to just a single table. The method for getFilteredRows seems to be the answer but it is not working.

我嘲笑Google在Code Playground中尝试获取此示例的示例工作。在这种情况下，我试图让饼图只显示那些年龄在20岁以上的人。

I've mocked up the example that Google has in the Code Playground to try to get this to work. In this case, I'm trying to have the Pie chart only show those that are 20 years or older.

（Google Code Playground的链接： http://code.google.com/apis/ajax/playground/?type=visualization# full_dashboard ）

(link to Google Code Playground: http://code.google.com/apis/ajax/playground/?type=visualization#full_dashboard)

代码我在尝试：

Code I'm trying:

function drawVisualization() {
  // Prepare the data
  var data = google.visualization.arrayToDataTable([
    ['Name', 'Gender', 'Age', 'Donuts eaten'],
    ['Michael' , 'Male', 12, 5],
    ['Elisa', 'Female', 20, 7],
    ['Robert', 'Male', 7, 3],
    ['John', 'Male', 54, 2],
    ['Jessica', 'Female', 22, 6],
    ['Aaron', 'Male', 3, 1],
    ['Margareth', 'Female', 42, 8],
    ['Miranda', 'Female', 33, 6]
  ]);  

  // Define a slider control for the Age column.
  var slider = new google.visualization.ControlWrapper({
    'controlType': 'NumberRangeFilter',
    'containerId': 'control1',
    'options': {
      'filterColumnLabel': 'Age',
    'ui': {'labelStacking': 'vertical'}
    }
  });

  // Define a category picker control for the Gender column
  var categoryPicker = new google.visualization.ControlWrapper({
    'controlType': 'CategoryFilter',
    'containerId': 'control2',
    'options': {
      'filterColumnLabel': 'Gender',
      'ui': {
      'labelStacking': 'vertical',
        'allowTyping': false,
        'allowMultiple': false
      }
    }
  });

  // Define a Pie chart
  var pie = new google.visualization.ChartWrapper({
    'chartType': 'PieChart',
    'containerId': 'chart1',
    'options': {
      'width': 300,
      'height': 300,
      'legend': 'none',
      'title': 'Donuts eaten per person',
      'chartArea': {'left': 15, 'top': 15, 'right': 0, 'bottom': 0},
      'pieSliceText': 'label'
    },
    // Instruct the piechart to use colums 0 (Name) and 3 (Donuts Eaten)
    // from the 'data' DataTable.
     'view': {
       'columns': [0,3],
       'rows': [
         {
           'calc': function(data) {
             return data.getFilteredRows({column: 2, minValue: 20});
           },
           'type': 'number'
         }]
     }
  });

  // Define a table
  var table = new google.visualization.ChartWrapper({
    'chartType': 'Table',
    'containerId': 'chart2',
    'options': {
      'width': '300px'
    }
  });

  // Create a dashboard
  new google.visualization.Dashboard(document.getElementById('dashboard')).
      // Establish bindings, declaring the both the slider and the category
      // picker will drive both charts.
      bind([slider, categoryPicker], [pie, table]).
      // Draw the entire dashboard.
      draw(data);
}

我从原始示例中改变的唯一东西是添加到'视图'部分。

The only thing I've changed from the original example is adding to the 'view' section of the Pie Chart.

任何人都有什么想法？

Anyone have any thoughts?

推荐答案

几个小小的变化：
*不需要'calc'，因为它用于创建新的计算列。
*函数的格式需要数组，即使是单个值也是如此。

Couple of small changes: * No need for 'calc' as it is used for creating new calculated columns. * the format of the function requires array even for a single value.

 'view': {'columns': [0, 3], 
         'rows' : data.getFilteredRows([{column: 2, minValue: 20}])} 

这篇关于使用Google Chart API控制板无法使用getFilteredRows的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！