Alexander S. Nossum@alexannoalexander.nossum@ntnu.nohttp://alexanno.net
Plan       Motivasjon        Teknikker          Verktøy           Demo        Litteratur
Hvorfor?                        rmasjo   n       m   en gder infoEnorme                                    yt e   s       ...
Tidsserier::Index chart og sparklines       Prosent / endringsrate                                  Overordnede trender
Tidsserier::Stacked graph (stream graph) Aggregerer (slår sammen) data Dypdykk i subset Ikke negative verdier Ikke for «ik...
Tidsserier::Small multiples                              Overordnede trender bedre                              Sammenlign...
Tidsserier::Horizon graphs                                   Negative verdier er speilet så de deler                      ...
Statistiske visualiseringer::Stem-n-leaf / histogram    0 |1 1 1 2 2 2 2 3 3 3 3 3 3 4 4 4 4 4 4 4 4 4 5 6 7 8 8 8 8 8 8 9...
Statistiske visualiseringer::Scatter plot matrise                             Sammenligner mellom flere dimensjoner       ...
Statistiske visualiseringer::Parallel coordinates                                 Sammenligner mellom flere dimensjoner   ...
«The best visualization made» (Tufte)                 Veldig rik på informasjon                 Viser mengder i både tid o...
Hierarkier::Kant-node diagrammer og dendrogrammer                            Vanlige trestrukturer                        ...
Hierarkier::Indented tree / innrykket tre                             Vi kjenner denne – men lett å glemme
Hierarkier::Adjacency diagrams / Nabodiagram (icicle)                         «fylt» tre                         Lengden a...
Hierarkier::Adjacency diagrams / nabodiagram (sunburst)                        Samme som forrig (icicle), men bruker polar...
Hierarkier::Treemaps                       Deler rektangler relativt til hierarkiet                       Kan bruke andre ...
Hierarkier::Packed circles                             Ganske lik treemap                             Bruker sirkler      ...
Grafer::Force directed layouts / kraftstyrt plassering                               Simulerer fysisk system              ...
Grafer::Arc diagrams / sirkelbuer                              Endimensjonal representasjon av en graf                    ...
Grafer::Matriser                   «Matematisk» representasjon av en matrise                   Ofte veldig bra og intuitiv...
Kart::Koropletkart (choropleth)               Veldig intuitive og «eksplisitte»               Tall MÅ VÆRE NORMALISERTE ti...
Kart::Skalerte sirkler/symboler                          Symboler kan være sirkler, diagram eller lignende                ...
Kart::Kartogram                  Dorling kartogram over fedme                  Geografisk form er byttet med symbol       ...
Kart::Space-time-cube                        Hägerstrand 1970                        Tiden er brukt som tredje dimensjon  ...
Kart:: Non-contiguous cartogram
Kart:: Contiguous cartogram
Kart:: Typografisk kart
Kart:: Innendørskart
Del II         Verktøy
Raster vs. VektorVektor:                    Raster:•Beskrevet matematisk      •Punkter / piksler•Skalerer uendelig        ...
Data::N2000 og N5000 – gratis illustrasjonskart    N5000: fra PowerPoint til Shape    Mye informasjon    Ikke veldig nøyak...
Data::Kilder               OpenStreetMap               -http://www.openstreetmap.org/               -http://download.geofa...
Data::Vasking
Tableau
ManyEyes
Inkscape
Google Chart
Google Fusion tables
CartoDB
GeoCommons
ESRI::ArcGIS, ArcGIS.com, ArcExplorer, ArcGIS4Office
Quantum GIS
Mapbox::Tilemill
Bryte grensene?                  Programmere!
GMaps API
OpenLayers
Leaflet
D3.js
Protovis
Processing
R
Enda sulten?
Demotime!PowerPoint          http://youtu.be/2679tpDiWqY?hd=1
Demotime!GoogleFusionTables          http://youtu.be/dki1xy3UMUQ?hd=1
Demotime!TileMill           http://youtu.be/VXs15FUq4qc?hd=1
Kommet på noen gode ideer?
Ressurser              http://selection.datavisualization.ch/              http://flowingdata.com/              http://pro...
Upcoming SlideShare
Loading in …5
×

Introduksjon til informasjonsvisualisering

465 views

Published on

Forelesning om informasjonsvisualisering til videreutdanningskurs på NTNU desember 2012.

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
465
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Phd-stipendiat Prosjekt: visualisering – spesielt innendørskart Er fra Kristiansand Akkurat som dyreparken – er det mye spennende, rart og nyttig i visualiseringsfaget. Vi skal se på: Visualiseringsmetoder Verktøy Jeg skal prøve å temme noen av dyrene / demonstrasjon av konkret løsning
  • Ekstremt mye informasjon 1200 exabytes i 2010 alene! Hva med 2020? Informasjonstsunami CLICK Katastrofe eller mulighet? Visualisering kan hjelpe oss å se lenger – eller surfe tsunamien Får en oversikt over massive mengder data sammenhenger, trender, utstikkere, unormaliteter Visualisering er essensielt for geografisk informasjon Kan du tenke deg å finne frem i en by basert på en liste med koordinater? Vi skal ta en tur å se de mest berømte dyrene i visualiseringsdyreparken
  • Index chart / indeksdiagram Viser ikke faktiske størrelser, men normalisert data Prosent Endringsrate ++ Aksjemarked Amazon og Google endrer seg likt – men forskjellig verdi Sparklines Morsomme! Kan være inkludert i tekst Finnes i nyeste Excel(!) Viser trender Overordnet Liker godt mye data
  • Yr.no Ganske pene Egner seg (kun) for data som kan la seg slå sammen Mest naturlig er å summere Leses «vertikalt» og horisontalt Negative verdier kan ikke representeres Sannsynlighet for et temperaturvarsel 100% sannsynlig at vi havner i dette (vertikale) området 50% sannsynlig at vi havner i et (mindre) område
  • Hesten: Oppdaget at hesten «svever» når den løper Fine for statiske medier (bøker, artikler, rapporter) Kan enkelt legge informasjon på toppen Streker som viser sammenheng Utheve elementer i flere av miniatyrene Er interaktive animasjoner bedre?
  • Vanlig graf (en linje) Mye vertikalt død-rom Negative verdier er under «null-linjen» Disse kan speiles og fargelegges – deler plass med positive verdier Deler i 3 (eller hva som helst) segmenter Fargelegger disse forskjellig «slår» de sammen i vertikal retning. Forskyver hvis nødvendig.
  • Befolkning pr stat USA
  • Internettbrukere 2002
  • Axis maps
  • Google Indoor Indoortube Vertical color map
  • OpenStreetMap: Dugnadskart Gratis Ikke garantert nøyaktig GeoFabrik har gratis ekstrakter SSB Mye spennende data Ofte “grid-basert” I 1 km grid over Norge Fine til mye spennende visualiseringer Natural Earth Gratis data fra kjente kilder Primært dekker det hele verden Ganske grove data NorgeDigitalt Den norske dugnaden Indrefileten Kjøpe tilgang eller være bidragsyter MANGE har tilgang, uten å vite det(!) Mange andre kilder også!
  • Ikke vær redd! Mange formater Mye skitten data Forvent mye datavasking Bruk så enkle metoder som mulig! Pass på projeksjoner Databaser er et godt resultat Excel Notepad på steroider: notepad++, textpad Find/Replace Regular expressions Google Fusion Tables OpenRefine Data wrangler
  • Både gratis og betalversjon Enkel web-publisering Drag/drop Ganske kraftig Begrenset geografisk visualisering Fint til å kombinere flere visualiseringer
  • Eksperiment fra IBM Web-basert Enkelt Tilbyr en god del standardvisualiseringer
  • Open Source Kraftig program for vektorgrafikk Primært tegneprogram Kan brukes til å lage kart fra bunnen av MEN, kan også brukes for å redigere kart fra GIS
  • Lager interaktive visualiseringer «on-demand» Tett integrert med Google-produkter (drive) Har en kraftig API for utviklere - Ex: kan hente inn et oppdatert pie chart akkurat som et bilde i en webside Fint for web
  • Kraftig verktøy for å filtere, kombinere og visualisere store datamengder Laster opp data til Google sine servere Bruker Google sin «kraft» til å manipulere data Kan produsere ganske mye, veldig raskt. Skal se eksempel på kommunekart senere
  • Lag ditt eget kart på nett Alt skjer i «skyen» Last opp egne data Kjør noen bestemte metoder Få tilgang til kart fra CartoDB sine servere Kan utvikle mot tjenesten Såkalt «freemium»: koster penger etter hvert (Spotify-modellen)
  • Mye av samme som CartoDB Lag ditt eget kart på nett Alt skjer i skyen Last opp egne data Manipuler data Lag kartvisualiseringer Såkalt «freemium»: koster penger etter hvert (Spotify-modellen)
  • ESRI: verdensherredømme på avansert GIS-programvare Open Source begynner å ta innpå ArcGIS (incl arcmap): kraftig pakke med «alt» Analyser Kartografi Datamanipulering Enorme muligheter Ofte det som brukes i organisasjoner som «GIS» Har også server, API +++ ArcGIS.com: Webkart Klikkeinterface Enkelt å bruke Kan lage en god del spesialiserte kart Har også noen analysemuligheter Har API for utviklere ArcGIS Explorer: En forenklet «visningsmodul» for ArcGIS.com og ArcGIS Desktop Har noen analysemoduler Gjør det veldig enkelt å lage «kartpresentasjoner» Ganske fin i bruk En slags utvidet Google Earth + PowerPoint ArcGIS4Office: Kart i MS Office(!) Gjør det forskrekkelig enkelt å få kart i MS Office (excel, powerpoint etc) Baksiden av medaljen? Dyrt – veldig dyrt! Noe gratis, som Explorer
  • Ganske kraftig! Gratis Har god støtte for enormt mange formater (flere enn arcgis)! Kan oppleves som litt «patch-work» noen ganger En klar favoritt
  • Mapbox: Sted for å lagre/distribuere kart. «freemium». Mange gode (gratis) verktøy som snakker bra med Mapbox, men også andre. Tilemill: Veldig kraftig kartografiverktøy for webkart Gearet mot «tiles»/kartfliser. Kan enkelt eksportere høyoppløselig i andre format også. Tar imot det meste av kartdata Bruker CartoCSS for å «stile» kartene. Gjør det veldig enkelt å lage avanserte kartvisualiseringer Anbefales på det sterkeste Vi skal ha en demo etter hvert Øving på nyåret med Atle
  • Startet webkart-revolusjonen Kraftig Primært rettet mot google tiles Støttes av alle, overalt Definitivt den mest utbredte kartklienten Er en enorm satsing fra Google – og nå et kjerneprodukt Milliarder av $ går med på å drifte dette. Lisenser+$$ Kan ikke «alt»: projeksjoner fks
  • Av GIS’ere – for GIS’ere Mye avansert funksjonalitet Veldig kraftig Kan gjøre det aller meste OpenSource Både positivt og negativt Atle sier nok mer på nyåret Baksiden: Kan oppleves litt komplisert og «tungrodd» OpenLayers 3 (neste versjon) Vil være vesentlig mye kraftigere 3D, WebGL, enklere, bedre dokumentert Når? Tja…
  • Satser på enkelhet Noen få oppgaver – men gjør de veldig bra HTML5 Mobilvennlig «smooth»
  • DataDrivenDocuments Visualisering direkte I nettleseren Javascript Manipulerer på “dokumenter” SVG, HTML, CSS Bruker data for å endre på webdokumenter Dokumentene kan være vektorgrafikk (svg), html eller alt mulig annet I nettleseren. Ikke et ekstra visualiseringsspråk, men et verktøy for å manipulere eksisterende webdokumenter Veldig kraftig Har støtte for en god del geografisk visualisering
  • Visualisering direkte i nettleseren Javascript Forgjenger til D3.js Mange kraftige visualiseringsteknikker
  • Eget språk Ligner på Java/Javascript Veldig enkelt å lage kraftige visualiseringer Noen geografiske pakker Lagd egen versjon i Javascript for visualisering i nettleseren
  • Eget språk Lagd for statistiske beregninger og visualiseringer Egnet for store datasett og komplekse analyser Ganske avansert å lære seg Ikke fryktelig lett å lage fine visualiseringer
  • Screenshot fra selection.datavisualization.ch Utvalget er enormt! Ikke sett dere fast i én av de – shop litt rundt. Lurt å kunne et noen få ganske godt
  • Video N2000 Merge med folketall fra SSB «Total» Er dette riktig? «TotalKv» Bedre? Farger: Eksperimenter med forskjellig skal Colorbrewer2.org Send rundt på ipad Finnes 2 hull i datasettet – hvilke er disse? - Hjemmelekse
  • Video N2000 i Tilemill Piratkart Enkelt å eksportere til pdf/png og som tiledatabaser (mbtiles) Kan lastes direkte til Mapbox (obs størrelse og $)
  • Spørsmål? Hva tror dere er mest nyttig i din organisasjon? Hva kommer dere til å prøve ut? Hva var vanskelig?
  • Introduksjon til informasjonsvisualisering

    1. 1. Alexander S. Nossum@alexannoalexander.nossum@ntnu.nohttp://alexanno.net
    2. 2. Plan Motivasjon Teknikker Verktøy Demo Litteratur
    3. 3. Hvorfor? rmasjo n m en gder infoEnorme yt e s 0 exab 1,20 60 mill io ner gan g e r så m ye som t h e Li b rary of Congre s s Informasjonstsunami Katastrofe eller mulighet?
    4. 4. Tidsserier::Index chart og sparklines Prosent / endringsrate Overordnede trender
    5. 5. Tidsserier::Stacked graph (stream graph) Aggregerer (slår sammen) data Dypdykk i subset Ikke negative verdier Ikke for «ikke-sum-verdier»
    6. 6. Tidsserier::Small multiples Overordnede trender bedre Sammenligning enklere (eller ikke?) Alle visualiseringer kan brukes
    7. 7. Tidsserier::Horizon graphs Negative verdier er speilet så de deler arealet med positive verdier Høy tetthet Bedre enn vanlige «area charts» Er vanskelig å lære
    8. 8. Statistiske visualiseringer::Stem-n-leaf / histogram 0 |1 1 1 2 2 2 2 3 3 3 3 3 3 4 4 4 4 4 4 4 4 4 5 6 7 8 8 8 8 8 8 9 1 |0 0 0 0 1 1 1 1 2 2 3 3 3 3 4 4 4 4 5 5 6 7 7 8 9 9 9 9 9 2 |0 0 1 1 1 5 7 8 9 3 |0 0 1 2 3 3 3 4 6 6 8 8 Enkel 4 |0 0 1 1 1 1 3 3 4 5 5 5 6 7 «Stem» er første signifikante nummer 5 |0 2 3 5 6 7 7 7 9 Andre signifikante nummer legges til som «leaf» 6 |1 2 6 7 8 9 9 9 Bruker data for å visualisere seg selv 7 |0 0 0 1 6 7 9 8 |0 0 1 2 3 4 4 4 4 4 4 4 5 6 7 7 7 9 9 |1 3 3 5 7 8 8 8 9 9 9 9 9 9 9 9 9 9 9 9 9 9 9 9 9 9 9 10 | 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
    9. 9. Statistiske visualiseringer::Scatter plot matrise Sammenligner mellom flere dimensjoner Speilet langs diagonalen Interaksjon er nyttig (brushing og linking)
    10. 10. Statistiske visualiseringer::Parallel coordinates Sammenligner mellom flere dimensjoner Kompakt Linjer mellom nabodimensjoner Rekkefølge på dimensjoner blir viktig
    11. 11. «The best visualization made» (Tufte) Veldig rik på informasjon Viser mengder i både tid og romKart::Flytkart
    12. 12. Hierarkier::Kant-node diagrammer og dendrogrammer Vanlige trestrukturer Rotnode i topp – barn under Dendrogram: -Justerer alle løvnoder på samme nivå -Brukt for cluster-visualisering og interaktiv filter
    13. 13. Hierarkier::Indented tree / innrykket tre Vi kjenner denne – men lett å glemme
    14. 14. Hierarkier::Adjacency diagrams / Nabodiagram (icicle) «fylt» tre Lengden av nodene kan representere informasjon
    15. 15. Hierarkier::Adjacency diagrams / nabodiagram (sunburst) Samme som forrig (icicle), men bruker polare koordinater istedenfor kartesiske
    16. 16. Hierarkier::Treemaps Deler rektangler relativt til hierarkiet Kan bruke andre former enn rektangler (Voronoi) Høyere noder er ikke fremtredende Veldig effektiv plassutnyttelse
    17. 17. Hierarkier::Packed circles Ganske lik treemap Bruker sirkler Ser hierarkiet bedre Sløser med plass
    18. 18. Grafer::Force directed layouts / kraftstyrt plassering Simulerer fysisk system Noder frastøter hverandre (tenk magnet) Kanter (streker) trekker noder til hverandre Kantverdi = tiltrekningskraft Kan bli komplisert å regne ut (ta litt tid)
    19. 19. Grafer::Arc diagrams / sirkelbuer Endimensjonal representasjon av en graf Struktur / overblikk er vanskelig å se «klikker» og «broer» er lette å se Rekkefølge på nodene er essensielt
    20. 20. Grafer::Matriser «Matematisk» representasjon av en matrise Ofte veldig bra og intuitivt Farge og rekkefølge hjelper ofte
    21. 21. Kart::Koropletkart (choropleth) Veldig intuitive og «eksplisitte» Tall MÅ VÆRE NORMALISERTE til det geografiske området Befolking VS. Befolknings per m^2 Kan bruke andre visuelle variabler enn fargetone (fks mønster)
    22. 22. Kart::Skalerte sirkler/symboler Symboler kan være sirkler, diagram eller lignende Størrelse på symboler, spesielt sirkler, bør være psykologisk skalert (ikke lineært)
    23. 23. Kart::Kartogram Dorling kartogram over fedme Geografisk form er byttet med symbol Størrelse representerer data Plassering er omtrent den samme som geografisk
    24. 24. Kart::Space-time-cube Hägerstrand 1970 Tiden er brukt som tredje dimensjon Geografi/kart er vanlig X og Y. Brukt til å studere temporære data - forflytning, øye-bevegelser, Minard
    25. 25. Kart:: Non-contiguous cartogram
    26. 26. Kart:: Contiguous cartogram
    27. 27. Kart:: Typografisk kart
    28. 28. Kart:: Innendørskart
    29. 29. Del II Verktøy
    30. 30. Raster vs. VektorVektor: Raster:•Beskrevet matematisk •Punkter / piksler•Skalerer uendelig •Skalerer ikke VEKTOR•Må tegnes på nytt •Raskt å tegne•Interaksjon •Mye brukt på webkart•Tileproblem •Tiles
    31. 31. Data::N2000 og N5000 – gratis illustrasjonskart N5000: fra PowerPoint til Shape Mye informasjon Ikke veldig nøyaktig: 5000m 1:3 000 000 til 1:7 500 000 Nok for mange oppgaver N2000 = 2000m nøyaktighet 1:1 500 000 til 1:3 000 000
    32. 32. Data::Kilder OpenStreetMap -http://www.openstreetmap.org/ -http://download.geofabrik.de/ Statistisk Sentralbyrå -http://www.ssb.no/emner/01/01/20 /arealbruk/index.html Natural Earth -http://www.naturalearthdata.com/ NorgeDigitalt - http://norgedigitalt.no
    33. 33. Data::Vasking
    34. 34. Tableau
    35. 35. ManyEyes
    36. 36. Inkscape
    37. 37. Google Chart
    38. 38. Google Fusion tables
    39. 39. CartoDB
    40. 40. GeoCommons
    41. 41. ESRI::ArcGIS, ArcGIS.com, ArcExplorer, ArcGIS4Office
    42. 42. Quantum GIS
    43. 43. Mapbox::Tilemill
    44. 44. Bryte grensene? Programmere!
    45. 45. GMaps API
    46. 46. OpenLayers
    47. 47. Leaflet
    48. 48. D3.js
    49. 49. Protovis
    50. 50. Processing
    51. 51. R
    52. 52. Enda sulten?
    53. 53. Demotime!PowerPoint http://youtu.be/2679tpDiWqY?hd=1
    54. 54. Demotime!GoogleFusionTables http://youtu.be/dki1xy3UMUQ?hd=1
    55. 55. Demotime!TileMill http://youtu.be/VXs15FUq4qc?hd=1
    56. 56. Kommet på noen gode ideer?
    57. 57. Ressurser http://selection.datavisualization.ch/ http://flowingdata.com/ http://processing.org/learning/books/ Few, S. 2009. Now I See It: Simple Visualization Techniques for Quantitative Analysis. Analytics Press. Tufte, E. 1983. The Visual Display of Quantitative Information. Graphics Press. Tufte, E. 1990. Envisioning Information. Graphics Press. Ware, C. 2008. Visual Thinking for Design. Morgan Kaufmann. Wilkinson, L. 1999. The Grammar of Graphics. Springer. Spence, R., 2007. Information Visualization: Design for Interaction, Prentice Hall. Fry, B., 2008. Visualizing Data: Exploring and Explaining Data with the Processing Environment, O’Reilly Media. Noble, J., 2012. Programming Interactivity, O’Reilly Media. Hägerstrand, T., 1970. What about people in Regional Science? Papers of the Regional Science Association, 24(1), pp.6–21. Heer, J., Bostock, M. & Ogievetsky, V., 2010. A tour through the visualization zoo. Communications of the ACM, pp.1–22.

    ×