LiveTable demo

This page demonstrates the LiveTable,
the data-presentation component used by LiveBase applications.


   

We are proud to introduce the Livetable, a business-intelligence component with an extremely simplified user interface.

 

The Livetable is an independent product now commercially available, but it is also used extensively by the applications generated on the Livebase platform.

 

In fact, every application generated on Livebase uses LiveTables to present data, and to allow users to interactively play with it (multilevel grouping on rows and columns, filtering, sorting, search and much more).

 

You can play immediately with a LiveTable by clicking on the screenshot: a LiveTable containing sample data will pop up on a new window.

 
You might want to read first this introductory page, just to make sure that you don't miss any of the exclusive features of the subsystem.

Click on the screenshot
to open the demo

Version 1.3.1

Server status: on-line



Multi-level grouping

Right-click on a column header and select the "Group by" command. The column will move to the left (the grouping section of the table )and its background will turn to orange. Click on the small [+] button  on the left of each grouped cell to expand the underlying rows, then click it again to collapse them. You can subgroup by another column by right-clicking on its header and selecting the "Subgroup by" command, or by dragging the header and dropping it on the grouping section (drag & drop also allows you to place the new column as the primary grouping). Please note that the background of the [+] buttons reflects the number of selected rows hidden under each collapsed group.

Statistics

Once grouped the rows by one or more columns, you can display statistics (min, max, avg, std) on the values hidden under each data-column. Just right-click on the header of a non-grouping column, click on "Statistics", check the statistics you want among the applicable ones (they depend on the data-type of the column), then click on the header to confirm. Please note that statistics are displayed only for groups of collapsed rows. Just place the mouse cursor over a collapsed grouping cell (close to the [+] button on its left) and wait one second in order to display a balloon reporting statistic information of the group (number of rows in the group, at the moment).


Distribution histograms

Once grouped the rows by one or more columns, you can display the distribution of the values under each non-grouping column by just clicking on the chart icon. The histogram divides the range of the values in ten subranges, and for each histogram draws a bar whose height is proportional to the number of samples in that subrange. Please note that distribution histograms are available only for groups of collapsed rows. Move the cursor on the diagram to get information for each histogram bar.


Advanced filtering

You can filter the rows displayed by applying multiple conditions in logical AND. Just click on the "funnel" icon, on the right side of the status bar, at the bottom of the table, in order to open the filter manager window. Note that advanced conditions must be predicates evaluating true/false and based on one or more column values. Advanced conditions can include all the common math/logical operators and functions: just right click on the editor to get a contextual menu. Click on headers and cells to enter values into a filter condition.

Draggable columns

You can change the order of the columns by just dragging and dropping the corresponding header. If you already have one or more grouping columns, you can automatically  group by a new column by dropping it into the grouping section. You can also hide a column by dragging it onto the wastebasket icon, on the right side of the status bar, at the bottom of the table. Hidden columns can be made visible again by just opening the wasbasket icon (click on it) and dragging the hidden header on the desired position.

Multi-level sorting

When no grouping is defines, all the rows can be  sorted by just clicking on the header of the column you  want to sort by (a small arrow appears). Clicking  again will invert the sorting direction. Multi-level sorting is automatically applied each time you group by one or more column. In fact, each grouping level is sorted automatically, and its sorting direction can be changed by clicking on its header.

Client-server architecture

The LiveTable is not just a client-side (GWT) component: it is a real sub-system with a very advanced server (the  LiveTableServant) capable of handling thousands of rows, and to serve them to the client via a very efficient protocol. A client-side cache, running on the browser behind the scenes, minimizes the client-server requests, and advanced DOM-manipulation techniques makes scrolling a breeze. Please note that rows are not paged on the LiveTable, and that the scrollbar size is proportional to the  number of visible rows against the total  number of rows available server-side.


Policy-based row selection

The live demo is configured to freely allow the selection of the rows. The CTRL key allows to increment a selection, while the SHIFT key allows to select blocks of adjacent rows. SHIFT and CTRL can be combined in order to augment a selection by a block of adjacent rows. The LiveTable can also be configured to completely disable row selection, to allow the selection of just one row, and to allow the selection of just one block of adjacent rows. The small pie-chart on the left side of the status bar, at the bottom of the table, reflects the number of selected rows against all the rows available server side. Click on the pie-chart to select/unselect all the rows.


Fully resizable & collapsible

You can drag the bottom border of the table in order to resize it vertically. Click on the collapse/expand icon (on the right side of the status bar, at the bottom of the table) in order to collapse or expand the body of the table. The  width of the LiveTable can be configured as fixed or depending on the  browser's window with an optional  minimum width.

Technology

The client-side of the LiveTable has been developed with GWT, the Google Web Toolkit. As far as we know, it's the most advanced table ever developed with the GWT technology. The server-side is developed with Java 1.6. and Tomcat 6.0. The demo launched by this page runs on an HP ML310-G4 server with Linux CentOS and 2Gb of RAM.

Commercial availability

The LiveTable is commercially available as a client-server component. The server side is pure java and runs on any standard servlet container like Tomcat. The LiveTable will be also available soon as a service for easier intergation into JSP, PHP, ASP and ASPx websites. Please drop us an email for terms and conditions.