Visualizations using Visualbox

29
VISUALIZATIONS WITH SPARQL AND VISUALBOX Alvaro Graves [email protected] @alvarograves

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

Page 1: Visualizations using Visualbox

VISUALIZATIONS WITHSPARQL ANDVISUALBOX

Alvaro Graves

[email protected]

@alvarograves

Page 2: Visualizations using Visualbox

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

Page 3: Visualizations using Visualbox

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

Page 4: Visualizations using Visualbox

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

Page 5: Visualizations using Visualbox

VISUALBOX

Page 6: Visualizations using 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 . }

Page 7: Visualizations using Visualbox

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

Page 8: Visualizations using Visualbox

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

Page 9: Visualizations using Visualbox

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

Page 10: Visualizations using Visualbox

countryLabel total

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

Page 11: Visualizations using Visualbox

View (html.template)

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

Page 12: Visualizations using Visualbox

TABULAR DATA

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

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

Page 13: Visualizations using Visualbox

View (html.template)

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

Page 14: Visualizations using Visualbox

View (html.template)

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

Page 15: Visualizations using Visualbox

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

Page 16: Visualizations using Visualbox

latitudelatitude longitudelongitude areaarea

45.4983 -91.7389 25.0

30.3167 -81.6667 2292

45.9989 -112.53 1868

Page 17: Visualizations using Visualbox

View (html.template)

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

Page 18: Visualizations using Visualbox

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")}

Page 19: Visualizations using Visualbox

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"}}

Page 20: Visualizations using Visualbox

PARALLEL COORDINATES

Page 21: Visualizations using Visualbox

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 .}

Page 22: Visualizations using Visualbox

View (html.template)

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

Page 23: Visualizations using Visualbox

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

Page 24: Visualizations using Visualbox

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"}}

Page 25: Visualizations using Visualbox
Page 26: Visualizations using Visualbox

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")

}

Page 27: Visualizations using Visualbox

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"}}

Page 28: Visualizations using Visualbox

TREE STRUCTURES (2)

Page 29: Visualizations using Visualbox

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