Motionchart

Bhoomi Gajjar

unread,

Jan 16, 2013, 5:06:00 AM1/16/13

to google-visua...@googlegroups.com

Hi,

I am new to Google APIs. I would like to get details of selected objects on motionchart. I tried getstate() method. but I am not able to get any data. below is my code

<html>

<head>

google.load('visualization', '1', { 'packages': ['motionchart'] });

google.setOnLoadCallback(drawChart);

// The select handler. Call the chart's getSelection() method

function onstatechange() {

alert("chart state changed");

};

function drawChart() {

var data = new google.visualization.DataTable();

data.addColumn('string', 'Fruit');

data.addColumn('date', 'Date');

data.addColumn('number', 'Sales');

data.addColumn('number', 'Expenses');

data.addColumn('string', 'Location');

data.addRows([

['Apples', new Date(1988, 0, 1), 1000, 300, 'East'],

['Oranges', new Date(1988, 0, 1), 1150, 200, 'West'],

['Bananas', new Date(1988, 0, 1), 300, 250, 'West'],

['Apples', new Date(1989, 6, 1), 1200, 400, 'East'],

['Oranges', new Date(1989, 6, 1), 750, 150, 'West'],

['Bananas', new Date(1989, 6, 1), 788, 617, 'West']

]);

var chart = new google.visualization.MotionChart(document.getElementById('chart_div'));

// google.visualization.events.addListener(chart, 'statechange', onstatechange());

chart.draw(data, { width: 600, height: 300 });

// alert(chart.getState());

google.visualization.events.addListener(chart, 'select', function () {

var row = chart.getSelection()[0].row;

var state = data.getValue(row, 0);

var rows = tableData.getFilteredRows([{column: 0, value: state}]);

tableView.setRows(rows);

table.draw(tableView, options);

});

}

</script>

</head>

<body>

</body>

</html>

Thanks,

Bhoomi Gajjar

asgallant

unread,

Jan 16, 2013, 12:41:02 PM1/16/13

to google-visua...@googlegroups.com

The motionchart's don't have a select event to fire, so you have to tease out the information you want from the statechange event. Here's an example based on your code: http://jsfiddle.net/asgallant/DunKF/

Bhoomi Gajjar

unread,

Jan 17, 2013, 9:11:38 AM1/17/13

to google-visua...@googlegroups.com

Hi,

Thank you very much for your help. I am wondering is it possible to bind data from sql server to this motionchart, If you can provide me some examples for the same.

Thanks,

Bhoomi

asgallant

unread,

Jan 17, 2013, 12:37:41 PM1/17/13

to google-visua...@googlegroups.com

Yes, you should be able to hook up data from SQLserver to the chart. You have to have a script on your webserver that can query the database and output the data in the required format. There are libraries available to help you do that in Java, Python, PHP, and .Net; depending on what scripting language you prefer on your server.

Reply all

Reply to author

Forward