Отговори (4)
Намерих заобиколно решение, трябва да използвате chartWrapper без таблото за управление, за да можете да подадете dataTable като параметър:
var $pieChart = new google.visualization.ChartWrapper({
'chartType': 'PieChart',
'containerId': 'pie_chart',
'options': {
'width': 300,
'height': 300,
},
//group the data for the pie chart
'dataTable' : google.visualization.data.group($dataTable, [0],
[{'column': 3, 'aggregation': google.visualization.data.sum, 'type': 'number'}])
});
$pieChart.draw();
$tableWrapper = new google.visualization.ChartWrapper({
'chartType': 'Table',
'containerId': 'table_data'
});
var $genderPicker = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'gender_filter',
'options': {
'filterColumnIndex': '2',
'useFormattedValue' : true,
'ui': {
'allowTyping': false,
'allowMultiple': false,
'labelStacking': 'vertical'
}
}
});
new google.visualization.Dashboard(document.getElementById('table_dashboard')).
bind([$genderPicker], [ $tableWrapper]).
draw($dataTable);
След това трябва да добавите обратно извикване към вашите контроли, така че когато контролата се промени, диаграмите извън таблото за управление ще се актуализират, като ръчно обвързване, нека приемем, че контролата за cust_sex е $genderPicker и обектът на таблицата ChartWrapper е $tableWrapper:
google.visualization.events.addListener($genderPicker, 'statechange',
function(event) {
// group the data of the filtered table and set the result in the pie chart.
$pieChart.setDataTable( google.visualization.data.group(
// get the filtered results
$tableWrapper.getDataTable(),
[0],
[{'column': 3, 'aggregation': google.visualization.data.sum, 'type': 'number'}]
));
// redraw the pie chart to reflect changes
$pieChart.draw();
});
Резултатът: всеки път, когато изберете мъж, жена или и двете, кръговата диаграма ще отразява филтрираните резултати, групирани по име. Надявам се да помогне на някого и съжалявам за счупения ми английски.
google.visualization.events.addListener(orgFilter, 'statechange', function(e) { alert(e); });
дава нула. също така не са налични променливи, дефинирани преди този израз. някакви идеи?
- person iRaS; 04.12.2012
друг начин да го направите е да използвате събитието 'ready' на обекта на таблото, след което да създадете диаграма или таблица там въз основа на групиране, направено към главната таблица на таблото.
eg:
//create datatable, filter elements and chart elements for the the dashboard then:
dash=new google.visualization.Dashboard(document.getElementById(elId));
google.visualization.events.addListener(dash, 'ready', function() {
//redraw the barchart with grouped data
//console.log("redraw grouped");
var dt=mainTable.getDataTable();
var grouped_dt = google.visualization.data.group(
dt, [0],
[{'column': 7, 'aggregation': google.visualization.data.sum, 'type': 'number'}]);
var mainChart = new google.visualization.ChartWrapper({
'chartType': 'ColumnChart',
'containerId': 'barChart',
'options': {
'height':500,
'chartArea':{'left':200}
},
//view columns from the grouped datatable
'view': {'columns': [0, 1]},
'dataTable':grouped_dt
});
mainChart2.draw();
});
dash.bind(
[lots,of,filter,elements],
[lots,of,chart,elements]
);
dash.draw(data)
След дълго проучване и развойна дейност намерих решението на този проблем. За корекцията използвах два слушателя на събития, в които единият е събитие ready, а другият е събитие statechange като,
google.visualization.events.addListener(subdivPicker, 'ready',
function(event) {
// group the data of the filtered table and set the result in the pie chart.
columnChart1.setDataTable( google.visualization.data.group(
// get the filtered results
table.getDataTable(),
[0],
[{'column': 2, 'aggregation': google.visualization.data.sum, 'type': 'number'}]
));
// redraw the pie chart to reflect changes
columnChart1.draw();
});
google.visualization.events.addListener(subdivPicker, 'statechange',
function(event) {
// group the data of the filtered table and set the result in the pie chart.
columnChart1.setDataTable( google.visualization.data.group(
// get the filtered results
table.getDataTable(),
[0],
[{'column': 2, 'aggregation': google.visualization.data.sum, 'type': 'number'}]
));
// redraw the pie chart to reflect changes
columnChart1.draw();
});
Намерете моята първоначална (проблемна) проба тук и коригирана (решена) проба тук
Прочетете тази тема: Как да не показвате таблицата с данни (прочетете поне първите две публикации - останалите наистина са важни само ако имате работа с големи набори от данни).
По принцип трябва да използвате междинна диаграма (таблиците са добър избор, тъй като те са сравнително бързи за писане и изобразяване, с по-нисък отпечатък на паметта от повечето диаграми), която е напълно скрита от потребителите. Вие свързвате инструмента за избор на категория към тази диаграма в таблото за управление. След това настройвате манипулатор на събитие за събитието „statechange“ на инструмента за избор, който взема данните, групира ги в нова DataTable и чертае кръговата диаграма въз основа на групираните данни.