HTML Tables and the Data Web
Some time ago now, I wrote a post about progressive enhancement of HTML web pages, including some examples of how HTML data tables could be enhanced to provide graphical views of the data contained in them.
I’m not sure if anyone is actively maintaining progressive enhancement browser extensions (I haven’t checked) but here are a couple more possible enhancements released as part of the Google visualisation API, as described in Table Formatters make Visualization tables even nicer:
A couple of other options allow you to colour a table cell according to value (an implementation of the ‘format cell on value’ function you find in many spreadsheets), and a formatter that will “format numeric columns by defining the number of decimal digits, how negative values are displayed and more”, such as adding a prefix or suffix to each number.
I’m not sure if these features are included in the QGoogleVisualizationAPI Google visualisation API PHP wrapper yet, though?
Also in my feed reader recently was this post on Search Engines Extracting Table Data on the Web, which asks:
what if Google focused upon taking information from tables that contain meaningful data (as opposed to tables that might be used on a web page to control the formatting of part or all of a page)?
What if it took all those data filled tables, and created a separate database just for them, and tried to understand which of those tables might be related to each other? What if it then allowed for people to search through that data, or combine the data in those tables with other data that those people own, or that they found elsewhere on the Web?
and then links to a couple of recent papers on the topic.
It strikes me that Javascript/CSS libraries could really help out here – for example structures like Google’s Visualisation API Table component and Yahoo’s UI Library DataTable (which makes it trivial to create sortable tables in your web page, as this example demonstrates: YUI Sortable Data Tables).
Both of these provide a programmatic way (that is, a Javascript way) of representing tabular data and then displaying it in a table in a well defined way.
So I wonder, will the regular, formalised display of tabular data make it easier to scrape the data back out of the table? That is, could we define GRDDL like transformations that ‘undo’ the datatable-to-HTML-table conversions, and map back from HTML tables to e.g. a JSON, XML or javascript datatable representations of the data?
Once we get the data out of the HTML table and into a more abstract datatable representation, might we then be able to use the Javascript data representation as a ‘database table’ and run queries on it? That is, if we have data described using one of these datatable representations, could we run SQL like queries on it in the page, for example by using TrimQuery, which provides a SQL-like query language that can be run against javascript objects?
Alternatively, could we map the data contained in a “regular” Google or Yahoo UI table to a Google spreadsheets like format – in which case, we might be able to use the Google Visualisation API Query Language? (I’m not sure if the Query Language can be applied directly to Google datatable objects?)
It’s not too hard then to imagine a browser extension that can be used to overlay a SQL-like query engine on top of pages containing Yahoo or Google datatables, essentially turning the page into a queryable database? Maybe even Ubiquity could be used to support this?



I recognized your article some days ago. While writing the QChartBuilder I added the Bar Format and Arrow Format features to the QGoogleVisualizationAPI v.0.3. Version 0.3 is not published yet, but the ChartBuilder is able to give you an image how it works.
Tom Schaefer
September 14, 2008 at 8:42 am
Thanks for the update, Tom.
I think I need to keep an eye on QChartBuilder ( http://www.query4u.de/QChartBuilder/ ), which looks like it could be an ideal testbed for people to play with many of the traditional charting techniques that I’ve been covering in parts of the Visual Gadgets uncourse – http://visualgadgets.blogspot.com
Tony Hirst
September 14, 2008 at 9:17 am
It seems like Google just opened up the ability to create “Data Views” on a gdata Data table: http://google-code-updates.blogspot.com/2008/09/dataview-makes-working-with.html
“we’ve borrowed from the well-known SQL concept of Views and created our own DataView. Today, with Google Visualization’s DataView you can reorder columns and “hide” a column such that the view includes only the columns you need to visualize. And, the DataView stays fully synchronized with the DataTable at all times, so any change to the underlying DataTable is reflected in the DataView.”
Tony Hirst
September 18, 2008 at 11:17 am
[...] with very little effort – see Progressive Enhancement – Some Examples and HTML Tables and the Data Web for more details… Possibly related posts: (automatically generated)HTML Tables and the Data [...]
Data Scraping Wikipedia with Google Spreadsheets « OUseful.Info, the blog…
October 22, 2008 at 10:20 am
[...] See also HTML Tables and the Data Web and the Google Visualization API Query Language , which apparently lets you “perform various [...]
Using YQL With Yahoo Pipes « OUseful.Info, the blog…
April 27, 2009 at 3:19 pm
[...] the question was, how to search the data in the spreadsheet. Now I had a half memory from HTML Tables and the Data Web of Google releasing a query language that would allow you to query data in a “data [...]
Querying a Google Spreadsheet of MPs’ Expenses Data: So Who Claimed for “biscuits”? « OUseful.Info, the blog…
May 14, 2009 at 11:46 pm
http://www.query4u.de/tests/samples/
I recently began to refactor QGoogleVisualizationAPI to enable
new features and a completely different notation :
i.e. you can make use of the API events which Google defined for the various chart objects).
You may have a look at my sneak preview of these features.
QGoogleVisualizationAPI will be part of a project which wraps some common javascript libraries and will provide a unique interface for the php language to write client or server side javascript applications.
project libraries for now:
- QGoogleVisualizationAPI
- Mootools, MochaUI (+ Layout)
- JQuery, with i.e. Layout-Plugin
- bridge to PHP-Ext Web 2.0 PHP Widget Library
Tom Schaefer
May 29, 2009 at 11:36 am
[...] most obvious example of this is the HTML table (see also: HTML Tables and the Data Web). Whilst often misused as a way of organising the visual layout of content on a page by designers [...]
IWMW Mashups Round the Edges: Scraping Tables « OUseful.Info, the blog…
July 28, 2009 at 2:48 pm
I released QGoogleVisualizationAPI2009. It now supports most advanced features used with Google’s Web Vis. API.
I.e. it supports Formatting, Patterns, Data Views etc.
You may have a look for it.
http://www.phpclasses.org/browse/package/5646.html
Greets Tom Schaefer
Tom Schaefer
September 12, 2009 at 9:38 am
[...] using google apps to present data, but if Data Ownership is an issue. Then why use google apps? http://ouseful.wordpress.com/2008/08/29/html-tables-and-the-data-web/ http://ouseful.open.ac.uk/blogarchive/014014.html [...]
Javascript Charts… « The Journeylers
January 1, 2010 at 12:57 am
[...] using google apps to present data, but if Data Ownership is an issue. Then why use google apps? http://ouseful.wordpress.com/2008/08/29/html-tables-and-the-data-web/ http://ouseful.open.ac.uk/blogarchive/014014.html [...]
Javascript Charts… | The Journeyler
December 2, 2012 at 10:00 am