Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 
Geomatik-Seminar am IGP/IKG, ET...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Dr. Matthias Stürmer, 11. Dezember 2014 
Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und ander...
Nächste SlideShare
Wird geladen in …5
×

Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools

1.106 Aufrufe

Veröffentlicht am

Immer häufiger lancieren Behörden, internationale Organsationen und NGOs Datenportale, über die riesige Mengen von Daten freigegeben werden. Moderne Open Source Tools wie D3.js erlauben es, mit neuartigen Visualisierungstechniken diese so genannten Open Data Bestände als interaktive Web-Applikationen zugänglich zu machen. Das Referat zeigt grundlegende Überlegungen zu Open Government Data und Datenvisualisierungen, demonstriert einige Beispiele und gibt eine Einführung in die technischen Grundlagen.

Veröffentlicht in: Technologie
3 Kommentare
3 Gefällt mir
Statistik
Notizen
Keine Downloads
Aufrufe
Aufrufe insgesamt
1.106
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
16
Aktionen
Geteilt
0
Downloads
15
Kommentare
3
Gefällt mir
3
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools

  1. 1. Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools Geomatik-Seminar am IGP/IKG, ETH Zürich 11. Dezember 2014 Dr. Matthias Stürmer Forschungsstelle Digitale Nachhaltigkeit Institut für Wirtschaftsinformatik Universität Bern
  2. 2. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 2 Kurzportrait > Seit August 2013 Oberassistent an der Universität Bern und Leiter Forschungsstelle Digitale Nachhaltigkeit > 2010 bis 2013 bei EY (Ernst & Young) Schweiz, Manager im Bereich IT Advisory > 2009 bis 2010 Business Development und Projektleiter beim Software-Unternehmen Liip AG > 2006 bis 2009 Doktorat an der ETH Zürich am Lehrstuhl für Strategisches Management und Innovation (D-MTEC) > 2000 bis 2005 Studium Betriebswirtschaft und Informatik an der Universität Bern, Masterarbeit am IWI > Seit 2004 Inhaber Einzelunternehmen nice, Matthias Stürmer > Mitgründer des Open Government Data Verein Opendata.ch > Vorstandsmitglied Swiss Open Systems User Group /ch/open > Geschäftsleiter der Parl. Gruppe Digitale Nachhaltigkeit > EVP-Stadtrat von Bern Dr. Matthias Stürmer Oberassistent, Leiter Forschungsstelle Digitale Nachhaltigkeit Universität Bern Institut für Wirtschaftsinformatik Engehaldenstrasse 8 CH-3012 Bern Tel: +41 31 631 38 09 Mobile: +41 76 368 81 65 matthias.stuermer@iwi.unibe.ch www.digitale-nachhaltigkeit.unibe.ch
  3. 3. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 3 Agenda 1. Einführung Open Government Data 2. Beispiele von Datenvisualisierungen 3. Technologische Grundlagen
  4. 4. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 4 Beginning of Open Government > Barack Obama, 21. Januar 2009: zwei "Memorandum for the Heads of Executive Departments and Agencies" > Transparency and Open Government — Government should be transparent. — Government should be participatory. — Government should be collaborative. > Information of Freedom Act (FOIA) — "In the face of doubt, openness prevails." — "commitment to accountability and transparency" Quellen: http://www.whitehouse.gov/the_press_office/TransparencyandOpenGovernment http://www.whitehouse.gov/the-press-office/freedom-information-act
  5. 5. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 5 Open Government Data Quelle: http://www.webnotwar.ca/i-sing-the-data-open Zusammenhang zwischen Open Government und Open Data: "Open Data is to Open Government as the Body is to the Soul. Open Government is made real by Open Data. Open Data enables an open government to interact with its citizens, and it is Open Data that helps bring to life the principles and objectives of Open Government."
  6. 6. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 6 10 Prinzipien von Open (Government) Data 1. Vollständigkeit: Alle öffentlichen Daten werden verfügbar gemacht. 2. Primärquelle: Die Daten werden an ihrem Ursprung gesammelt. 3. Zeitnah: Daten werden umgehend zur Verfügung gestellt. 4. Zugänglich: Daten werden allen für möglichst viele Verwendungszwecke bereit gestellt. 5. Maschinenlesbar: Daten sind in einem offenen, strukturiertem Format gespeichert. 6. Nicht diskriminierend: Daten sind allen ohne Registrierung verfügbar. 7. Nicht proprietär: Zur Dateninterpretation wird keine proprietäre Software benötigt. 8. Freie Lizenz: Daten sind unter einer freien Lizenz (z.B. Open Government Licence). 9. Permanent verfügbar: Datenbestände sind permanent online und versioniert verfügbar. 10. Kostenlos: Der Zugriff auf die Daten ist kostenlos. Quellen: http://sunlightfoundation.com/policy/documents/ten-open-data-principles/ http://www.netzpolitik.org/2010/8-open-government-data-prinzipien/
  7. 7. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 7 Qualität von Open Data: 5 Star Open Linked Data Quelle: http://www.youtube.com/watch?v=ga1aSJXCFe0 Gov 2.0 Expo 2010: Tim Berners-Lee, "Open, Linked Data for a Global Community"
  8. 8. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 8 Qualität von Open Data: 5 Star Open Linked Data Quelle: http://www.5stardata.info ★ make your stuff available on the Web (whatever format) under an open license ★★ make it available as structured data (e.g., Excel instead of image scan of a table) ★★★ use non-proprietary formats (e.g., CSV instead of Excel) ★★★★ use URIs to denote things, so that people can point at your stuff ★★★★★ link your data to other data to provide context5
  9. 9. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 9 Open Government Implementation Model > 2011 von Gwanhoo Lee (The American University) und Young Hoon Kwak (The George Washington University) > Open Government Implementation Model (OGIM) Quelle: http://www.businessofgovernment.org/report/open-government-implementation- model-moving-increased-public-engagement
  10. 10. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 10 Pro: Argumente für die Öffnung von Behördendaten > Anrecht auf freie Daten Den Bürgern gehören die Behördendaten, denn sie wurden im Auftrag des Staates mit Steuergeldern erarbeitet. > Demokratie Freier und ungehinderter Datenzugang sind Voraussetzung für Meinungsbildung und Partizipation an politischen Prozessen. > Wirtschaftlichkeit Durch öffentliche Daten werden Prozesse und Missstände sichtbar, somit werden behörden-interne Vorgänge verbessert. > Innovation Das Innovationspotential von Open Government Data wird als hoch eingeschätzt, somit bilden freie Behördendaten einen wirtschaftlichen Vorteil. Quelle: http://www.collaboratory.de/w/Abschlussbericht_Offene_Staatskunst
  11. 11. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 11 Ökonomische Studie OGD Schweiz, 2013 > Jährlicher Wertschöpfungsanteil aus OGD in der Schweiz zwischen 900 Millionen und 1.2 Milliarden Franken > Jährlicher Nettonutzen von OGD für den Bund liegt zwischen 2.9 Millionen und 20.3 Millionen Franken. > Auf Gebühren (u.a. Geodaten) kann verzichtet werden. Quelle: http://www.bar.admin.ch/themen/01648/01651/index.html?lang=de
  12. 12. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 12 Contra: Argumente gegen die Öffnung von Behördendaten > Datenschutz: Zusammenführen von anonymisierten Daten lässt unter Umständen doch Rückschlüsse auf bestimmte Personen ziehen > Staatssicherheit: Die Freigabe von Daten von Geheimdiensten oder Militär können die Staatssicherheit gefährden, deshalb von OGD ausgenommen > Fehlinterpretation: Rohdaten lassen falsche Interpretationen zu, Deutungshoheit liegt nicht mehr alleine bei Behörden, kann zu Reputationsschäden führen > Diskriminierung: Transparenz kann zu noch mehr Stigmatisierung bestimmter Wohnbezirke oder Bevölkerungsgruppen führen > Haftung: Behörden könnten für Verluste, Verletzungen oder Schäden bei der Verwendung der Daten haftbar gemacht werden > Kosten: Interne und externe Kosten zur Vorbereitung, Publikation und Bekanntmachung der Daten > Qualität: Datenqualität ist in Form von Rohdaten besser ersichtlich > Organisationskultur: OGD benötigt Kulturwandel in der Verwaltung > Partizipation: Mediales Interesse heisst noch nicht, dass Bevölkerung tatsächlich an allen OGD Datensätzen interessiert ist Quellen: http://www.kdz.eu/de/webfm_send/1206 "Open Government Vorgehensmodell" http://www.collaboratory.de/w/Abschlussbericht_Offene_Staatskunst
  13. 13. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 13 OGD Strategie Schweiz 2014-2018 > Vom Bundesrat am 16. April 2014 verabschiedet > Inhalt OGD Strategie Schweiz: — Vision — Zielsetzungen — Rahmenbedingungen — Umsetzung Quelle: https://www.news.admin.ch/message/index.html?lang=de&msg-id=52688
  14. 14. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 14 Vision OGD Strategie Schweiz > OGD ermöglicht Innovation und wirtschaftliches Wachstum Innovative Unternehmen können neue Informationsdienstleistungen entwickeln, Lebensqualität verbessert sich, neue wissenschaftliche Erkenntnisse über Entwicklung der Schweiz möglich > OGD fördert Transparenz und Partizipation Tätigkeit von Regierung und Verwaltung werden transparenter, Bevölkerunge kann politische Rolle und gesellschaftliche Verantwortung kompetenter wahrnehmen > OGD erhöht die Effizienz der Verwaltung Behörden können eigenen Daten über politische und organisatorische Grenzen hinweg besser nutzen, Datenqualität dank Nutzer-Rückmeldungen verbessern
  15. 15. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 15 Zielsetzungen > Freigabe der Behördendaten Bund stellt Öffentlichkeit geeignete Daten in maschinenlesbaren und offenen Formaten zur freien Wiederverwendung zur Verfügung, alle Rahmenbedingungen sind angepasst, "Open Data by Default" > Koordinierte Publikation und Bereitstellung der Behördendaten Zentrale Infrastruktur für Datenbestände aufbauen, Publikation der Metadaten, zuständige Verwaltungseinheiten publizieren Beschreibungen ihrer Datenbestände auf OGD-Portal, standardisierte technische Zugriffsfunktionen für die offenen Daten anbieten > Etablierung einer Open-Data-Kultur Bund fördert Nutzung der offenen Daten, Etablierung einer partizipativen und innovativen Open-Data-Kultur
  16. 16. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 16 Umsetzung: Grundsätze 1. OGD als Handlungsmaxime — OGD als Handlungsprinzip für alle geeigneten Behördendaten, Anpassung rechtlicher Grundlagen 2. Offene und wiederverwendbare Behördendaten — Rechtlich: möglichst freie, einheitliche und verständlichen Nutzungsbedingungen — Finanziell: Grundsätzliche Gebührenbefreiung, auch kommerzielle Weiterverwendung durch Firmen gebührenbefreit — Technisch: Daten in maschinenlesbarer Form anbieten, möglichst offene Formate anwenden
  17. 17. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 17 Umsetzung: Grundsätze 3. Leicht zugängliche Behördendaten — zentrale Publikationsplattform (OGD-Portal mit Metadatenverzeichnis) — standardisiertes Vorgehen für die Publikation und Bereitstellung der Daten — Metadatenformat (Titel, Kurzbeschreibung, Autor etc.) — Dateninventar und nationale Datenfreigabeplanung 4. Kooperation mit den OGD-Anwenderinnen und -Anwendern als Voraussetzung — Etablierung einer Open-Data-Kultur in der Bundesverwaltung — Stärkung der Kompetenzen im Umgang mit Daten — Zusammenarbeit mit nationaler und int. Open-Data-Community
  18. 18. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 18 Umsetzung: Massnahmen 1. Überprüfung und Anpassung der rechtlichen Rahmenbedingungen 2. Datenfreigabeprozess 3. Datenfreigabeplanung 4. Inventarisierung der Datenbestände des Bundes 5. Überprüfung der Gebührenpolitik 6. Aufbau des OGD-Portals 7. Bereitstellung von Hilfsmitteln und Instrumenten für die Datenpublikation und -bereitstellung 8. Auswahl und Definition der OGD-Standards 9. Erarbeitung einheitlicher Nutzungsbedingungen 10. Erarbeitung eines OGD-Kooperationsmodells 11. Dialog mit den OGD-Anwendern 12. Bekanntmachung des Datenangebots in der Öffentlichkeit 13. Evaluation der Wirkung von OGD
  19. 19. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 19 Agenda 1. Einführung Open Government Data 2. Beispiele von Datenvisualisierungen 3. Technologische Grundlagen
  20. 20. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 20 D3.js – www.d3js.org
  21. 21. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 21 D3: Reingold–Tilford Tree Quelle: http://bl.ocks.org/mbostock/4339184
  22. 22. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 22 D3: Radial Reingold–Tilford Tree Quelle: http://bl.ocks.org/mbostock/4063550
  23. 23. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 23 D3: Hierarchical Edge Bundling Quelle: http://bl.ocks.org/mbostock/7607999
  24. 24. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 24 D3: Visualisierte Interessenbindungen im Schweizer Parlament Quelle: NZZ, 4. März 2014 http://www.nzz.ch/aktuell/schweiz/die-daten-hinter-der-visualisierung-1.18255344
  25. 25. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 25 D3: Cushion Treemaps Quelle: Jarke J. van Wijk and Huub van de Wetering, Cushion Treemaps: Visualization of Hierarchical Information, 1999 http://www.win.tue.nl/~vanwijk/ctm.pdf
  26. 26. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 26 D3: Zoomable Treemaps Quelle: http://mbostock.github.io/d3/talk/20111018/treemap.html
  27. 27. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 27 D3: Obama’s 2012 budget proposal Quelle: http://www.nytimes.com/packages/html/newsgraphics/2011/0119-budget/
  28. 28. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 28 D3: Clustered Force Layout I Quelle: http://bl.ocks.org/mbostock/1747543
  29. 29. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 29 D3: Tax Rates of U.S. Companies Quelle: http://www.nytimes.com/interactive/2013/05/25/sunday-review/corporate-taxes.html?_r=0
  30. 30. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 30 D3: Circle Packing Quelle: http://bl.ocks.org/mbostock/4063530/
  31. 31. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 31 D3: Zoomable Circle Packing Quelle: http://bl.ocks.org/mbostock/7607535/
  32. 32. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 32 D3: Budget 2015 von Brig-Glis Quelle: http://brig-glis.budget.opendata.ch
  33. 33. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 33 D3: Kanton Bern ASP 2014 http://be-asp.budget.opendata.ch Grafischer Überblick: Detailinformationen:
  34. 34. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 34 D3: Kanton Bern ASP 2014
  35. 35. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 35 Sankey Diagram Quelle: https://en.wikipedia.org/wiki/Sankey_diagram/
  36. 36. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 36 D3: Sankey Diagrams Quelle: http://bost.ocks.org/mike/sankey/
  37. 37. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 37 D3: Finanzausgleich im Kanton Bern Quelle: http://be-fa.budget.opendata.ch/
  38. 38. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 38 D3: Chord Diagram Quelle: http://bl.ocks.org/mbostock/4062006
  39. 39. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 39 D3: World of Debt Quelle: http://www.roxxistic.me/blog/we-are-the-world-of-debt/
  40. 40. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 40 D3: Bilevel Partition Quelle: http://bl.ocks.org/mbostock/5944371
  41. 41. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 41 D3: Deutscher Bundeshaushalt 2013 Quelle: http://www.bundeshaushalt-info.de/startseite/#/2013/soll/ausgaben/einzelplan.html
  42. 42. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 42 Polymaps: Choropleth Map Quelle: http://polymaps.org/ex/statehood.html
  43. 43. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 43 Polymaps: Krankenkassenprämien Quelle: http://healthinsurance.opendata.ch
  44. 44. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 44 Polymaps: Krankenkassenprämien Quelle: http://www.actmore.ch/comparatif/
  45. 45. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 45 https://kfd.piratenfraktion-nrw.de
  46. 46. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 46 Parallel Coordinates Quelle: Alfred Inselberg, Multidimensional Detectives, 1997 http://www.cs.ucdavis.edu/~ma/ECS289H/papers/Inselberg1997.pdf
  47. 47. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 47 D3: Parallel Coordinates Quelle: http://syntagmatic.github.io/parallel-coordinates/
  48. 48. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 48 D3: Nutrient Contents Quelle: http://exposedata.com/parallel/
  49. 49. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 49 earth.nullschool.net
  50. 50. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 50 Faux-3D Arcs http://bl.ocks.org/dwtkns/4973620
  51. 51. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 51 three.js – www.threejs.org
  52. 52. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 52 Periodic Table http://threejs.org/examples/css3d_periodictable.html
  53. 53. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 53 Sprites http://threejs.org/examples/css3d_sprites.html
  54. 54. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 54 Ocean Shaders http://threejs.org/examples/webgl_shaders_ocean.html
  55. 55. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 55 Dynamic Terrain http://threejs.org/examples/webgl_terrain_dynamic.html
  56. 56. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 56 Jelly Fish http://aleksandarrodic.com/p/jellyfish/
  57. 57. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 57 piste.io earth.nullschool.net
  58. 58. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 58 Agenda 1. Einführung Open Government Data 2. Beispiele von Datenvisualisierungen 3. Technologische Grundlagen
  59. 59. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 59 Open Data Vorlesung App Entwicklung: 29 Open Data Apps von 60 Studierenden Mit Data Coaches oder von Datenportalen Erstmalige Durchführung: Frühlingssemester 2014 am Institut für Wirtschaftsinformatik der Universität Bern
  60. 60. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 60 Open Data Apps der Studierenden
  61. 61. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 61 Vorlesungs-Website http://www.iwi.unibe.ch/content/studium/veranstaltungen/resource/open_data_datenmanagement_und_visualisierung/
  62. 62. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 62 Bottom-Up Approach: Interactive Data Visualization for the Web > O'Reilly Media, von Scott Murray > März 2013, 272 Seiten, Englisch > ISBN-10: 1449339735 > Gratis online als ebook > Auf Amazon.de für CHF 22.50 > „Create and publish your own interactive data visualization projects on the Web-even if you have little or no experience with data visualization or web development.” > Total 13 Kapitel, 10 Kapitel davon werden in den Übungen behandelt
  63. 63. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 63 D3.js API Reference Application Programming Interface von D3.js: https://github.com/mbostock/d3/wiki/API-Reference > Selections - manipulate elements in the current document. > Transitions - interpolate attributes and styles smoothly over time. > Arrays - manipulate arrays and objects with ease. > Requests - load external data. > Formatting - convert numbers, dates and other objects to strings. > Localization - control locale-specific behavior, such as number formatting. > Colors - parse and manipulate colors; work with color spaces. > Namespaces - extend D3's support for XML namespaces. > Math - miscellaneous mathematical functions. > Internals - sundry utilities for extending D3.
  64. 64. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 64 Chaining Methods d3.select("body").append("p").text("New paragraph!"); D3 References the D3 object, so we can access its methods. Our D3 adventure begins here. .select("body") Give the select() method a CSS selector as input, and it will return a reference to the first element in the DOM that matches. .append("p") append() creates whatever new DOM element you specify and appends it to the end (but just inside) of whatever selection it’s acting on. Finally, append() hands off a reference to the new element it just created. .text("New paragraph!") text() takes a string and inserts it between the opening and closing tags of the current selection. ; The all-important semicolon indicates the end of this line of code. Chain over.
  65. 65. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 65 d3.select("body").selectAll("p") .data(dataset) .enter() .append("p") .text("New paragraph!"); Binding Data d3.select("body") Finds the body in the DOM and hands off a reference to the next step in the chain. .selectAll("p") Selects all paragraphs in the DOM. Because none exist yet, this returns an empty selection. Think of this empty selection as representing the paragraphs that will soon exist. .data(dataset) Counts and parses our data values. There are five values in our array called dataset, so everything past this point is executed five times, once for each value. .enter() To create new, data-bound elements, you must use enter(). This method looks at the current DOM selection, and then at the data being handed to it. If there are more data values than corresponding DOM elements, then enter() creates a new placeholder element on which you can work your magic. It then hands off a reference to this new placeholder to the next step in the chain. .append("p") Takes the empty placeholder selection created by enter() and appends a p element into the DOM. Hooray! Then it hands off a reference to the element it just created to the next step in the chain. .text("New paragraph!") Takes the reference to the newly created p and inserts a text value.
  66. 66. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 66 Using Your Data Die Testdaten: var dataset = [ 5, 10, 15, 20, 25 ]; Anzeigen der Testdaten: d3.select("body").selectAll("p") .data(dataset) .enter() .append("p") .text(function(d) {return "I can count up to " + d; }); Nur die letzte Zeile anpassen: .style("color", function(d) { if (d > 15) { //Threshold of 15 return "red"; } else { return "black"; } });
  67. 67. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 67 Top Down Approach: Anpassen bestehender D3.js Snippets Vorgehen: 1. Welche Daten werden visualisiert? -> Bevölkerungswachstum 2. Welche Visualisierungsart macht Sinn? -> D3 Show Real 3. Wie muss ich die Daten anpassen? -> Transponieren 4. Was muss ich am Code Snippet anpassen -> Pfade 5. Was läuft schief? -> Debugging
  68. 68. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 68 Daten von opendata.admin.ch holen Link: http://opendata.admin.ch/de/dataset/je-d-01-04-02-00-01
  69. 69. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 69 ODS Datei mit LibreOffice geöffnet
  70. 70. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 70 Export der Daten als UTF-8 CSV-Datei
  71. 71. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 71 Daten als CSV in Brackets öffnen
  72. 72. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 72 Daten bereinigen: Kommentare und doppelte Zwischenräume löschen
  73. 73. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 73 Daten bereinigen: Hochkommas löschen
  74. 74. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 74 Top Down Approach: Anpassen bestehender D3.js Snippets Vorgehen: 1. Welche Daten werden visualisiert? -> Bevölkerungswachstum 2. Welche Visualisierungsart macht Sinn? -> D3 Show Real 3. Wie muss ich die Daten anpassen? -> Transponieren 4. Was muss ich am Code Snippet anpassen -> Pfade 5. Was läuft schief? -> Debugging
  75. 75. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 75 D3.js Code Snippets Link: https://github.com/mbostock/d3/wiki/Gallery
  76. 76. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 76 D3.js Code Snippets Link: http://christopheviau.com/d3list/gallery.html
  77. 77. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 77 D3.js Code Snippets Link: http://bl.ocks.org/mbostock
  78. 78. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 78 D3.js Code Snippets Link: http://bost.ocks.org/mike/
  79. 79. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 79 Es gibt viele D3 Snippets im Internet...
  80. 80. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 80 Auswahl einer passenden Visualisierung Link: http://bl.ocks.org/syntagmatic/3891711
  81. 81. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 81 Auswahl einer passenden Visualisierung: D3 Show Reel Link: http://bl.ocks.org/mbostock/1256572
  82. 82. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 82 Code und Datenformat von D3 Show Reel analysieren Link: http://bl.ocks.org/mbostock/1256572
  83. 83. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 83 Top Down Approach: Anpassen bestehender D3.js Snippets Vorgehen: 1. Welche Daten werden visualisiert? -> Bevölkerungswachstum 2. Welche Visualisierungsart macht Sinn? -> D3 Show Real 3. Wie muss ich die Daten anpassen? -> Transponieren 4. Was muss ich am Code Snippet anpassen -> Pfade 5. Was läuft schief? -> Debugging
  84. 84. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 84 Daten in LibreOffice öffnen
  85. 85. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 85 Daten kopieren und transponieren
  86. 86. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 86 Top Down Approach: Anpassen bestehender D3.js Snippets Vorgehen: 1. Welche Daten werden visualisiert? -> Bevölkerungswachstum 2. Welche Visualisierungsart macht Sinn? -> D3 Show Real 3. Wie muss ich die Daten anpassen? -> Transponieren 4. Was muss ich am Code Snippet anpassen -> Pfade 5. Was läuft schief? -> Debugging
  87. 87. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 87 Code Snippet in Bracket kopieren
  88. 88. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 88 Pfad zu D3.js Bibliothek anpassen
  89. 89. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 89 Pfad zu CSV-Daten anpassen
  90. 90. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 90 Pfad zu CSV-Daten anpassen
  91. 91. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 91 Top Down Approach: Anpassen bestehender D3.js Snippets Vorgehen: 1. Welche Daten werden visualisiert? -> Bevölkerungswachstum 2. Welche Visualisierungsart macht Sinn? -> D3 Show Real 3. Wie muss ich die Daten anpassen? -> Transponieren 4. Was muss ich am Code Snippet anpassen -> Pfade 5. Was läuft schief? -> Debugging
  92. 92. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 92 A) Gar keine Darstellung -> Console
  93. 93. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 93 Fehler in der Beschriftung der Spalten
  94. 94. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 94 Fehler in der Beschriftung der Spalten
  95. 95. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 95 B) Fehlerhafte Darstellung
  96. 96. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 96 Falsches Datumsformat
  97. 97. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 97 Korrektes Datumsformat
  98. 98. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 98 Jetzt klappts!
  99. 99. Dr. Matthias Stürmer, 11. Dezember 2014 Datenvisualisierungen mit der Open Source JavaScript Bibliothek D3.js – und anderen Tools 99 Fragen und Diskussion > Für weitere Fragen und Anliegen rund um Open Government, Open Data und Datenvisualisierungen: Dr. Matthias Stürmer Oberassistent, Leiter Forschungsstelle Digitale Nachhaltigkeit Universität Bern Institut für Wirtschaftsinformatik Engehaldenstrasse 8 CH-3012 Bern Tel: +41 31 631 38 09 Mobile: +41 76 368 81 65 matthias.stuermer@iwi.unibe.ch www.digitale-nachhaltigkeit.unibe.ch

×