Google Visualization Mapper

Download Report

Transcript Google Visualization Mapper

Google Visualization Mapper
Dr. Mike Mitri
James Madison University
Data –to- Visualization Mappings
Visualiza
tion
Object
Data
Source
SQL
Visualiza
tion
Object
SQL
SQL
Data
Source
Query results
SQL
User-generated
SQL queries
Data-to-Visualization
Mapping Algorithms
Visualiza
tion
Object
Google Data Visualizations
• JavaScript library of objects and functions for
various types of interactive charts, images,
and animations
• Google’s visualization API website:
http://code.google.com/apis/chart/interactive
/docs/index.html
Some Google Visualizations
Gauge
TreeMap
Motion Chart
Dygraph (time series)
All of these are interactive and can respond to user events.
Mapping Recursive Query to Google
Data Visualization Org Chart
• Query should be a “recursive query” (e.g. based on a unary
relationship of employees and their managers)
• Result set has two required fields (and one optional field)
– The dependent entity (e.g. the employee)
– The parent entity (e.g. the manager)
– Any extra information to display
• Result set is used to generate HTML and JavaScript
• Javascript executes in a browser to produce the org chart
• Org chart object in Google Documentation (note expected
data format):
• http://code.google.com/apis/chart/interactive/docs/gallery/org
chart.html
Result Set (from AdventureWorks
database)
JavaScript Generated from Query and Result Set
JavaScript Generated from Query and Result Set
Create data table
JavaScript Generated from Query and Result Set
Define columns
From result set metadata
JavaScript Generated from Query and Result Set
Add a row of data
From result set data
JavaScript Generated from Query and Result Set
Create and draw visualization based on data table. The visualization
should be associated with a <DIV> element in the html document.
Resulting Google Visualization
Screenshot of Google Visualization Generator
User enters connection string and SQL query, and selects visualization type
WebBrowser control contains resulting
visualization
JavaScript generated from query