@Override public Widget asWidget() { final ListStore<Data> store = new ListStore<Data>(dataAccess.nameKey()); store.addAll(TestData.getData(12, 20, 100)); final Chart<Data> chart = new Chart<Data>(); chart.setStore(store); chart.setShadowChart(true); NumericAxis<Data> axis = new NumericAxis<Data>(); axis.setPosition(Position.BOTTOM); axis.addField(dataAccess.data1()); axis.addField(dataAccess.data2()); axis.addField(dataAccess.data3()); TextSprite title = new TextSprite("Number of Hits"); title.setFontSize(18); axis.setTitleConfig(title); axis.setDisplayGrid(true); axis.setMinimum(0); axis.setMaximum(100); chart.addAxis(axis); CategoryAxis<Data, String> catAxis = new CategoryAxis<Data, String>(); catAxis.setPosition(Position.LEFT); catAxis.setField(dataAccess.name()); title = new TextSprite("Month of the Year"); title.setFontSize(18); catAxis.setTitleConfig(title); chart.addAxis(catAxis); final BarSeries<Data> bar = new BarSeries<Data>(); bar.setYAxisPosition(Position.BOTTOM); bar.addYField(dataAccess.data1()); bar.addYField(dataAccess.data2()); bar.addYField(dataAccess.data3()); bar.addColor(new RGB(148, 174, 10)); bar.addColor(new RGB(17, 95, 166)); bar.addColor(new RGB(166, 17, 32)); chart.addSeries(bar); final Legend<Data> legend = new Legend<Data>(); legend.setPosition(Position.RIGHT); legend.setItemHighlighting(true); legend.setItemHiding(true); chart.setLegend(legend); TextButton regenerate = new TextButton("Reload Data"); regenerate.addSelectHandler( new SelectHandler() { @Override public void onSelect(SelectEvent event) { store.clear(); store.addAll(TestData.getData(12, 0, 100)); chart.redrawChart(); } }); ToggleButton animation = new ToggleButton("Animate"); animation.addValueChangeHandler( new ValueChangeHandler<Boolean>() { @Override public void onValueChange(ValueChangeEvent<Boolean> event) { chart.setAnimated(event.getValue()); } }); animation.setValue(true, true); ToggleButton shadow = new ToggleButton("Shadow"); shadow.addValueChangeHandler( new ValueChangeHandler<Boolean>() { @Override public void onValueChange(ValueChangeEvent<Boolean> event) { chart.setShadowChart(event.getValue()); chart.redrawChart(); } }); shadow.setValue(true); ToolBar toolBar = new ToolBar(); toolBar.add(regenerate); toolBar.add(animation); toolBar.add(shadow); ContentPanel panel = new FramedPanel(); panel.getElement().getStyle().setMargin(10, Unit.PX); panel.setCollapsible(true); panel.setHeadingText("Grouped Bar Chart"); panel.setPixelSize(620, 500); panel.setBodyBorder(true); final Resizable resize = new Resizable(panel, Dir.E, Dir.SE, Dir.S); resize.setMinHeight(400); resize.setMinWidth(400); panel.addExpandHandler( new ExpandHandler() { @Override public void onExpand(ExpandEvent event) { resize.setEnabled(true); } }); panel.addCollapseHandler( new CollapseHandler() { @Override public void onCollapse(CollapseEvent event) { resize.setEnabled(false); } }); new Draggable(panel, panel.getHeader()).setUseProxy(false); VerticalLayoutContainer layout = new VerticalLayoutContainer(); panel.add(layout); toolBar.setLayoutData(new VerticalLayoutData(1, -1)); layout.add(toolBar); chart.setLayoutData(new VerticalLayoutData(1, 1)); layout.add(chart); return panel; }
public Widget asWidget() { final Chart<Site> chart = new Chart<Site>(600, 400); chart.setDefaultInsets(20); final ListStore<Site> store = new ListStore<Site>(siteAccess.nameKey()); Date initial = f.parse("Feb 1"); for (int i = 0; i < 7; i++) { store.add( new Site(initial, Math.random() * 20 + 80, Math.random() * 20 + 40, Math.random() * 20)); initial = CalendarUtil.copyDate(initial); CalendarUtil.addDaysToDate(initial, 1); } chart.setStore(store); NumericAxis<Site> axis = new NumericAxis<Site>(); axis.setPosition(Position.LEFT); axis.addField(siteAccess.visits()); TextSprite title = new TextSprite("Number of Hits"); title.setFontSize(18); axis.setTitleConfig(title); axis.setDisplayGrid(true); axis.setMinimum(0); axis.setMaximum(100); chart.addAxis(axis); final TimeAxis<Site> time = new TimeAxis<Site>(); time.setField(siteAccess.date()); time.setStartDate(f.parse("Feb 1")); time.setEndDate(f.parse("Feb 7")); time.setLabelProvider( new LabelProvider<Date>() { @Override public String getLabel(Date item) { return f.format(item); } }); chart.addAxis(time); LineSeries<Site> series = new LineSeries<Site>(); series.setYAxisPosition(Position.LEFT); series.setYField(siteAccess.visits()); series.setStroke(new RGB(148, 174, 10)); series.setShowMarkers(true); series.setMarkerIndex(1); Sprite marker = Primitives.circle(0, 0, 6); marker.setFill(new RGB(148, 174, 10)); series.setMarkerConfig(marker); chart.addSeries(series); series = new LineSeries<Site>(); series.setYAxisPosition(Position.LEFT); series.setYField(siteAccess.views()); series.setStroke(new RGB(17, 95, 166)); series.setShowMarkers(true); series.setMarkerIndex(1); marker = Primitives.cross(0, 0, 6); marker.setFill(new RGB(17, 95, 166)); series.setMarkerConfig(marker); chart.addSeries(series); series = new LineSeries<Site>(); series.setYAxisPosition(Position.LEFT); series.setYField(siteAccess.veins()); series.setStroke(new RGB(166, 17, 32)); series.setShowMarkers(true); series.setMarkerIndex(1); marker = Primitives.diamond(0, 0, 6); marker.setFill(new RGB(166, 17, 32)); series.setMarkerConfig(marker); chart.addSeries(series); update = new Timer() { @Override public void run() { Date startDate = CalendarUtil.copyDate(time.getStartDate()); Date endDate = CalendarUtil.copyDate(time.getEndDate()); CalendarUtil.addDaysToDate(startDate, 1); CalendarUtil.addDaysToDate(endDate, 1); chart .getStore() .add( new Site( endDate, Math.random() * 20 + 80, Math.random() * 20 + 40, Math.random() * 20)); time.setStartDate(startDate); time.setEndDate(endDate); chart.redrawChart(); } }; update.scheduleRepeating(1000); ToggleButton animation = new ToggleButton("Animate"); animation.addValueChangeHandler( new ValueChangeHandler<Boolean>() { @Override public void onValueChange(ValueChangeEvent<Boolean> event) { chart.setAnimated(event.getValue()); } }); animation.setValue(true, true); ToolBar toolBar = new ToolBar(); toolBar.add(animation); ContentPanel panel = new FramedPanel(); panel.getElement().getStyle().setMargin(10, Unit.PX); panel.setCollapsible(true); panel.setHeadingText("Live Chart"); panel.setPixelSize(620, 500); panel.setBodyBorder(true); VerticalLayoutContainer layout = new VerticalLayoutContainer(); panel.add(layout); toolBar.setLayoutData(new VerticalLayoutData(1, -1)); layout.add(toolBar); chart.setLayoutData(new VerticalLayoutData(1, 1)); layout.add(chart); panel.addAttachHandler( new AttachEvent.Handler() { @Override public void onAttachOrDetach(AttachEvent event) { if (event.isAttached() == false) { update.cancel(); } } }); return panel; }