Visualizations using Visualbox

Post on 05-Dec-2014

1.368 views 0 download

description

In this talk I will show Visualbox, a "visualization server" based on LODSPeaKr that can make easy for non javascript experts to create simple but meaningful visualizations.

Transcript of Visualizations using Visualbox

VISUALIZATIONS WITHSPARQL ANDVISUALBOX

Alvaro Graves

gravea@rpi.edu

@alvarograves

MOTIVATIONLinked Data brings tons of multidimensional data thatis easy(*) to query

However, having to make use of all that data we stillneed to being able to process it (as humans)

One good way to make sense of this data is by usingvisualizations

(*) Once you learn SPARQL

EXAMPLE

versus

Images: Few, Stephen (2010): Data Visualization for Human Perception. In: Soegaard, Mads and Dam, Rikke Friis (eds.). "Encyclopedia of Human-Computer Interaction". Aarhus, Denmark:The Interaction Design Foundation. Available online at http://www.interaction-design.org/encyclopedia/data_visualization_for_human_perception.html

VISUALBOXBased on

Make use of new and already existing visualizationfilters

Creating of visualization via new GUI

Principle: Good data representation leads to good/easydata manipulation

Corolary: Effort should be focused on obtaining theright data

LODSPeaKr

VISUALBOX

MODELS (SPARQL QUERY)Using the SELECT query form will return a table, similar

to SQL.

person1person1 person2person2http://example.org/john http://example.org/paulhttp://example.org/john http://example.org/ringohttp://example.org/george http://example.org/paul

main.query

PREFIX foaf: <http://xmlns.com/foaf/0.1/>

SELECT ?person1 ?person2 WHERE{ ?person1 foaf:knows ?person2 . }

VIEWS (TEMPLATES)We can decide how to operate with the data.

html.template

<ul>{{for row in models.main}} <li>{{row.person1.value}} knows {{row.person2.value}}</li>{{endfor}}</ul>

output

http://example.org/john knows http://example.org/paul

http://example.org/john knows http://example.org/ringo

http://example.org/george knows http://example.org/paul

FILTERSIt is possible to apply filters to the data.

Template

{{for row in models.main}} {{row.person1.value|upper}}{{endfor}}

Output

HTTP://EXAMPLE.ORG/JOHNHTTP://EXAMPLE.ORG/JOHNHTTP://EXAMPLE.ORG/GEORGE

VISUALIZATION FILTERS

It is possible to apply visualization filters directly to allthe results. These filters will generate the necessary

code to create a visualizationModel (main.query)

PREFIX cat: <http://dbpedia.org/resource/Category:>

SELECT ?countryLabel (COUNT(?nobel) as ?total) WHERE { ?nobel dcterms:subject cat:Nobel_laureates_in_Physics; a foaf:Person; dbp:placeOfBirth ?country .

?country a schema:Country ; rdfs:label ?countryLabel FILTER(LANG(?countryLabel) = "en")}GROUP BY ?country ?countryLabelORDER BY DESC(?total)LIMIT 100

countryLabel total

United States 23Germany 14England 9Japan 6Austria-Hungary 5France 5Netherlands 4German Empire 3Soviet Union 3United Kingdom 3Italy 3

View (html.template)

<body> <h2>Total of Nobel laureates in Physics by country</h2> {{models.main|GoogleVizPieChart:"countryLabel,total"}}</body>

TABULAR DATA

Easiest case: consider table-based visualizations.View (html.template)

{{models.main|GoogleVizColumnChart:"countryLabel,total"}}

View (html.template)

{{models.main|GoogleVizBarChart:"countryLabel,total"}}

View (html.template)

{{models.main|GoogleVizLineChart:"countryLabel,total"}}

MAPSRepresent data as latitude, longitude and label

SELECT DISTINCT ?city SAMPLE(?lat) AS ?latitude SAMPLE(?long) AS ?longitude ?area WHERE{ ?city a sch:City ; <http://dbpedia.org/ontology/country> <http://dbpedia.org/resource/United_States> ; geo:lat ?lat ; geo:long ?long; dbp:areaTotalKm ?area .

}GROUP BY ?city ?areaORDER BY DESC(?area)LIMIT 10

latitudelatitude longitudelongitude areaarea

45.4983 -91.7389 25.0

30.3167 -81.6667 2292

45.9989 -112.53 1868

View (html.template)

{{models.main|GoogleMaps:"latitude,longitude,area,width=800"}}

PARALLEL COORDINATESQuery

SELECT ?carLabel ?wheelbase ?carWidth ?carLength ?transmission WHERE { ?car dcterms:subject <http://dbpedia.org/resource/Category:Lamborghini_vehicles>; <http://dbpedia.org/ontology/Automobile/wheelbase> ?wheelbase; <http://dbpedia.org/ontology/MeanOfTransportation/height> ?carWidth; <http://dbpedia.org/ontology/MeanOfTransportation/length> ?carLength; <http://dbpedia.org/property/transmission> ?transmission; rdfs:label ?carLabel. FILTER(LANG(?carLabel) = "en")}

PARALLEL COORDINATEScarLabelcarLabel wheelbasewheelbase carWidthcarWidth carLengthcarLength transmissiontransmission

Lamborghini Aventador 2700.0 1136.0 4780.0 7

Lamborghini Reventón 2665.0 1135.0 4700.0 6

Lamborghini 400GT 2550.0 1257.0 4470.0 5

Template

{{models.main|D3ParallelCoordinates:"carLabel,wheelbase,carWidth,carLength,transmission"}}

PARALLEL COORDINATES

GRAPHS

Question: How to express a graph in a table?

Answer: Table child → parent

person1person1 person2person2

Elizabeth Engstrom Ray Bradbury

Neil Gaiman Robert A. Heinlein

Neil Gaiman Ray Bradbury

Model (main.query)

SELECT ?person1 ?person2 WHERE{ ?person1 foaf:knows ?person2 .}

View (html.template)

{{models.main|D3ForceGraph:"person1,person2"}}

TREE STRUCTURESProblem: How do we retrieve a tree as a table?

Solution (so far): Table child,parent with one row with noparent (root)

childchild parentparent areaarea

Averill Park, New York Rensselaer County, New York 8.02896e+06

Sand Lake, New York Rensselaer County, New York 9.36e+07

Schaghticoke (town), New York Rensselaer County, New York 1.3442e+08

Poestenkill (town), New York Rensselaer County, New York 8.44336e+07

Schaghticoke (village), New York Rensselaer County, New York 2.33099e+06

Rensselaer County, New York

TREE STRUCTURESQuery

PREFIX d: <http://dbpedia.org/ontology/>SELECT max(?regionLabel) as ?child max(?superregionLabel) as ?parent (max(?totalArea) as ?area) WHERE{ { ?region d:isPartOf <http://dbpedia.org/resource/Rensselaer_County,_New_York>; d:areaTotal ?totalArea ; rdfs:label ?regionLabel; d:isPartOf ?superregion . ?superregion rdfs:label ?superregionLabel. FILTER(?superregion = <http://dbpedia.org/resource/Rensselaer_County,_New_York>) FILTER(lang(?superregionLabel) = "en") }UNION{ ?region rdfs:label ?regionLabel . FILTER(?region = <http://dbpedia.org/resource/Rensselaer_County,_New_York>) }FILTER(lang(?regionLabel) = "en")}GROUP BY ?regionLabel ?superregionLabel

Template

{{models.main|D3CirclePacking:"child,parent,area"}}

TREE STRUCTURES (2)Query (neruda.query)

PREFIX rdfs: <http://www.w3.org/2000/01/rdf-schema#>

PREFIX dbp: <http://dbpedia.org/ontology/>

PREFIX d: <http://dbpedia.org/resource/>

SELECT DISTINCT ?child ?parent WHERE{

{

?childNode dbp:influencedBy ?mid ;

rdfs:label ?child .

?mid dbp:influencedBy ?parentNode;

rdfs:label ?parent .

FILTER(LANG(?parent) = "en" && ?parentNode = d:Pablo_Neruda)

}UNION{

?childNode dbp:influencedBy d:Pablo_Neruda;

dbp:influencedBy ?parentNode;

rdfs:label ?child .

?parentNode rdfs:label ?parent .

FILTER(LANG(?parent) = "en" && ?parentNode = d:Pablo_Neruda)

}UNION{

d:Pablo_Neruda rdfs:label ?child

}

FILTER(LANG(?child) = "en")

}

childchild parentparent

Pablo Neruda

Dane Zajc Pablo Neruda

Gary Soto Pablo Neruda

James Tate (writer) Pablo Neruda

Richard Aitson Pablo Neruda

Erin Siegal Pablo Neruda

Jože Snoj Dane Zajc

Rudi Šeligo Dane Zajc

Veno Taufer Dane Zajc

Rigoberto González Gary Soto

Thomas Lux James Tate (writer)

html.template

{{models.main|D3Dendrogram:"child,parent"}}

TREE STRUCTURES (2)

NOW YOU CREATE YOUR OWNVISUALIZATION

Use data that is of interest for you

Describe to tell a story or support a statement

Give me feedback on how does visualbox works foryou