java - How to set the state of a Google Visualization Motion Chart? -
i'm using gwt , google chart tools (aka visualization) 1.1 library of google api libraries gwt.
i want display motion chart , set state possible in javascript.
has idea how set state?
here modified motionchart gwt-getting started page data javascript documentation. didn't test i'm not sure if code works.
public class simpleviz implements entrypoint { public void onmoduleload() { // create callback called when visualization api // has been loaded. runnable onloadcallback = new runnable() { public void run() { panel panel = rootpanel.get(); motionchart chart = new motionchart(createtable(), createoptions()); panel.add(chart); } }; visualizationutils.loadvisualizationapi(onloadcallback, motionchart.package); } private options createoptions() { options options = options.create(); options.setwidth(600); options.setheight(300); options.settitle("my motion chart"); // passing json state escaped double quotes options class. options.setstate("{\"orderedbyy\":false,\"showtrails\":true,\"dimensions\":{\"icondimensions\":[\"dim0\"]},\"yaxisoption\":\"3\",\"xzoomedin\":false,\"time\":\"1988-04-16\",\"yzoomedin\":false,\"xaxisoption\":\"2\",\"yzoomeddatamin\":150,\"yzoomeddatamax\":617,\"xzoomeddatamin\":300,\"unicolorfornonselected\":false,\"xlambda\":1,\"playduration\":15000,\"ylambda\":1,\"duration\":{\"timeunit\":\"d\",\"multiplier\":1},\"icontype\":\"bubble\",\"iconkeysettings\":[{\"trailstart\":\"1988\",\"key\":{\"dim0\":\"apples\"}},{\"trailstart\":\"1988\",\"key\":{\"dim0\":\"oranges\"}},{\"trailstart\":\"1988\",\"key\":{\"dim0\":\"bananas\"}}],\"coloroption\":\"2\",\"xzoomeddatamax\":1200,\"nonselectedalpha\":0.4,\"orderedbyx\":false,\"sizeoption\":\"_unisize\"}"); return options; } private abstractdatatable createtable() { datatable data = datatable.create(); data.addcolumn('string', 'fruit'); data.addcolumn('date', 'date'); data.addcolumn('number', 'sales'); data.addcolumn('number', 'expenses'); data.addcolumn('string', 'location'); data.addcolumn(columntype.string, "fruit"); data.addcolumn(columntype.date, "date"); data.addcolumn(columntype.number, "sales"); data.addcolumn(columntype.number, "expenses"); data.addcolumn(columntype.string, "location"); data.addrows(6); data.setvalue(0, 0, "apples"); data.setvalue(0, 1, new date (1988,0,1)); data.setvalue(0, 2, 1000); data.setvalue(0, 3, 300); data.setvalue(0, 4, "east"); data.setvalue(1, 0, "oranges"); data.setvalue(1, 1, new date (1988,0,1)); data.setvalue(1, 2, 1150); data.setvalue(1, 3, 200); data.setvalue(1, 4, "west"); data.setvalue(2, 0, "bananas"); data.setvalue(2, 1, new date (1988,0,1)); data.setvalue(2, 2, 300); data.setvalue(2, 3, 250); data.setvalue(2, 4, "west"); data.setvalue(3, 0, "apples"); data.setvalue(3, 1, new date (1989,6,1)); data.setvalue(3, 2, 1200); data.setvalue(3, 3, 400); data.setvalue(3, 4, "east"); data.setvalue(4, 0, "oranges"); data.setvalue(4, 1, new date (1989,6,1)); data.setvalue(4, 2, 750); data.setvalue(4, 3, 150); data.setvalue(4, 4, "west"); data.setvalue(5, 0, "bananas"); data.setvalue(5, 1, new date (1989,6,1)); data.setvalue(5, 2, 788); data.setvalue(5, 3, 617); data.setvalue(5, 4, "west"); return data; } }
Comments
Post a Comment