The next video (don't forget to select HD) shows a live showcase with some interactive sample dashboards built using the Dashbuilder client API. All the dashboards are fed from a dynamically generated client data set. So there is no interaction with the backend. All the operations (group, filter, sort) are performed on the client side. The Dashbuilder architecture allows for handling data sets on both client & server though. For demo purposes we have gone for the client approach as it is easier to implement.
In next blog entries we will walk through the architecture internals as well as the APIs. Today, I'm just going to give an overview of how these sample dashboards have been built.
The four dashboards (see screenshots below) are fed from a dynamically generated data set (the sales opportunities data set - SalesDataSetGenerator.java), which is a Bean type data set generator that registers a data set at Showcase initialization time. The dashboards themselves are just GWT UI Binder widgets composed by a bunch of data viewer instances spread on the same page layout.
Let's take for instance the first dashboard. The UI Binder template (SalesGoals.ui.xml) is used to lay out all the charts properly. Each chart is assigned a unique identifier used within the dashboard (SalesGoals.java).
|Dashboard UI binder template|
The chart definition is composed by two parts, both defined using a very simple but powerful API.
- A data set reference the chart is going to display. Here we can specify a plain data set or a data set lookup which is just a sequence of operations (filter, sort, group) performed over an existing data set.
- A display configuration or how we want to visualize the data. There are several types of visualizations - pie, bar, line, area, meter, map bubble charts, tables, hierarchical trees, etc... The display settings will depend on the type of visualization chosen.
|Data Displayer API sample|
As I said, we'll dive into the API internals in next blog entries. For now, just taking a look at the examples is the quickest way to figure out how this API works.
The project is hosted on Github. Despite it's in a very early stage of development we're pushing hard to bring many new features in the next few months:
- Data visualization editors
- Drag&drop dashboard composer
- Renderer based on the D3 library
- Support for real-time dashboards
- RESTful API for remote dashboard interaction
That's all. I encourage you to clone the project, build, run it and play with the examples.