1

アプリで縦棒グラフといくつかのカテゴリ フィルターを使用してダッシュボードを作成しようとしています。次のようなデータがあります。

['First name', 'City', 'Number of children'],
['Michael' , 'London', 2],
['Elisa', 'Paris', 3],
['Robert', 'Moskov', 3],
['John','LA', 1],
['Jessica', 'Kyiv', 3],
['Aaron', 'New York', 2],
['Margareth','Tokyo', 3 ]

しかし、このデータではなく、同じ数の子供を持つ人の合計数を示す表を視覚化する必要があります。

['1 人の子供', '2 人の子供', '3 人の子供'],

[1、2、4]

したがって、最初のテーブルにフィルターを適用すると、2 番目のテーブルのデータを自動的に再計算する必要があります。このテーブルとコントロールをどうにかしてバインドできますか? または、フィルターごとにいくつかのハンドラーを配置し、データを手動で再計算する必要がありますか?

4

2 に答える 2

1

あなたのデータが与えられたと仮定します：

['First name', 'City', 'Number of children'],
['Michael' , 'London', 2],
['Elisa', 'Paris', 3],
['Robert', 'Moskov', 3],
['John','LA', 1],
['Jessica', 'Kyiv', 3],
['Aaron', 'New York', 2],
['Margareth','Tokyo', 3 ]

この結果を取得するには、2 番目の列 (子供の数) でグループ化します。

[1, 1],
[2, 2],
[3, 4]

これは、データ テーブルの集計機能によるグループを使用して簡単に行うことができます。

サンプルコードは次のとおりです。

function drawJoin() {
  var dt = google.visualization.arrayToDataTable([
    ['First name', 'City', 'Number of children'],
    ['Michael' , 'London', 2],
    ['Elisa', 'Paris', 3],
    ['Robert', 'Moskov', 3],
    ['John','LA', 1],
    ['Jessica', 'Kyiv', 3],
    ['Aaron', 'New York', 2],
    ['Margareth','Tokyo', 3 ]
  ]);

  // Group dt by column 2, and count number of entries for each.
  var grouped_dt = google.visualization.data.group(
      dt, [2],
      [{'column': 0, 'aggregation': google.visualization.data.count, 'type': 'number'}]);


  var table = new google.visualization.Table(document.getElementById('table'));
  table.draw(dt, null);

  var grouped_table = new google.visualization.Table(document.getElementById('grouped_table'));
  grouped_table.draw(grouped_dt, null);
}

Google Playgroundでお試しください(上記のコードをコピーして貼り付けてください)。

それをそのままグラフ化することも、javascript 関数を使用して転置して、データテーブルの行/列を転記することもできます。

したがって、元のデータ テーブルでコントロールを使用してフィルター処理を行い、グループ化関数を作成して、グループ化されたテーブルをグラフに描画する必要があります。

ラベルに数字の 1 だけでなく「1 子」と表示させたい場合は、グループの出力が数字になるため、SetFormattedValue()を使用して関数を作成する必要があります。既にデータ テーブルで作業を行っているため、これを上記の転置関数と組み合わせることができます。

于 2013-01-25T05:04:03.073 に答える
0

同じデータがあると仮定し、それらをグループ化し、グループ化されたデータに基づいて縦棒グラフを作成します。ここで、いくつかのフィルターを追加したいと思います。データのグループ化に使用する列にフィルターを簡単に追加できますが、別の列にフィルターを追加すると、「無効な列ラベル」というエラーが発生しました。たとえば、次を追加すると:

var categoryPicker = new google.visualization.ControlWrapper({ 'controlType': 'CategoryFilter', 'containerId': 'control2', 'options': { 'filterColumnLabel': 'Performance', 'ui': { 'labelStacking': ' vertical', 'allowTyping': false, 'allowMultiple': true } } });

すべて問題ありませんが、私の目的は、列「市区町村」と「名」のフィルターを追加することであり、それらの値を変更すると、グループ化されたデータを含む縦棒グラフに影響するはずです。これが可能なら？

于 2013-01-25T20:58:00.823 に答える