open data: datenmanagement und visualisierung … · 2020-02-07 · fs 2014 open data > 12:...

Open Data: Datenmanagement und Visualisierung Datenaktualiserung und Transitionen, Programming Coaching

Termin 12, 15. Mai 2014

Dr. Matthias Stürmer und Prof. Dr. Thomas Myrach Universität Bern, Institut für Wirtschaftsinformatik Abteilung Informationsmanagement Forschungsstelle Digitale Nachhaltigkeit

FS 2014

Open Data > 12: Datenaktualiserung und Transitionen, Programming Coaching

2

12: Datenaktualiserung und Transitionen, Programming Coaching

Donnerstag, 15. Mai 2014 > Buch „Interactive Data Visualization for the Web“

Kapitel 9: Updates, Transitions, and Motion > Links:

http://chimera.labs.oreilly.com/books/1230000000345/ch09.html http://examples.oreilly.com/0636920026938/chapter_09/

> Datenaktualisierung, Transitionen

Programming Coaching im zweiten Teil der Vorlesung: > Khôi Tran, Open Data App Entwickler

http://chimera.labs.oreilly.com/books/1230000000345/ch09.html

http://examples.oreilly.com/0636920026938/chapter_09/

FS 2014


3

Agenda

1. Evaluation, App-Reminder, Nacht der Forschung, Masterarbeiten

2. Datenaktualisierung und Transitionen

FS 2014


4

Gesamtevaluation

FS 2014


5

Vermittlung des Themas

FS 2014


6

Engagement der Lehrperson

FS 2014


7

Schwierigkeitsgrad und Umfang

FS 2014


8

Globale Veranstaltungsbeurteilung

FS 2014


9

Fachkompetenz des Dozenten

FS 2014


10

Vermittlungskompetenz des Dozenten

FS 2014


11

Engagement der Studierenden

FS 2014


12

Engagement der Studierenden

FS 2014


13

Hauptstudium

FS 2014


14

Semester, Geschlecht

FS 2014


15

Kommentare

> Was fanden Sie an dieser Veranstaltung besonders gut? — Engagierter Dozent — Praktischer Bezug, Programmieren einer App — Gastvorträge — Podcast; Abwechslung durch Gastreferenten — Der praktische Bezug. Der Sinn. Der Inhalt. Der Dozent. Sehr schöne

Idee, macht Riesenspass. Deshalb gebe ich so gute Note, obwohl Kreuze was anderes erwarten lassen würden.

— Neues aktuelles Thema, Praxisbezug, Arbeit mit Externen (Daten Coaches); Gastvorträge eine gute Idee, Motivation und Unterstützung durch Dozent und andere Personen

— Praxisbezogenes Arbeiten — Gute Betreuung, angenehme Umgangsformen; Buch gibt eine gute

und verständliche Einführung für Programmier-Analphabeten — Die Aktualität der Unterlagen und des Stoffs. (Eine Seltenheit)

FS 2014


16

Kommentare

> Was fanden Sie an dieser Veranstaltung besonders gut? — Freundlicher Dozent; versucht den Studierenden zu helfen und Wissen

zu vermitteln — Gastreferate waren sehr spannend; Projekt ist super, braucht jedoch

viel Wissen in JavaScript/HTML; Dozent gibt sich Mühe und das merkt man -> sympathisch.

— Die Veranstaltung zu Beginn hat mir sehr gut gefallen. Ich hatte einen guten Einblick ins Open Data und die meisten Gastvorträge waren sehr interessant. Auch war ich sehr froh um die zur Verfügung gestellten Podcasts.

— Matthias unterrichtet engagiert — Beispiele aus der Praxis (externe Vorträge); Podcast — Die Idee der Veranstaltung ist super! Sehr interessant und aktuell! — Einführung in die Programmieren, Geschwindigkeit angemessen für

nicht Erfahrene, Buch sehr gut

FS 2014


17

Kommentare

> Was fanden Sie an dieser Veranstaltung besonders gut? — Experten — Zusammenarbeit mit den Data Coaches; Die Freiheit selbst nach

Wunsch zu programmieren; Die Hilfe nach der Vorlesung Probleme zu beseitigen

— Praktische Arbeit, Interdisziplinarität — Man kann sicher viele neue Sachen lernen, da wir sonst keine

vergleichbare Veranstaltung haben. Praktisches Arbeiten finde ich gut. — App erstellen -> sehr konkret; Buch exakt zum Thema, guter Einstieg

ins Programmieren — Der praktische Teil; Gastvorträge — Viele Gastvorträge — Die Vorlesung an sich und die Thematik sind sehr interessant. Herr

Stürmers Engagement is sehr gut — Ich finde toll, dass man etwas Praktisches entwickeln kann

FS 2014


18

Kommentare

> Was fanden Sie an dieser Veranstaltung besonders schlecht? — Oft is in den Folien der Gastreferenten nicht klar, was wichtig für die

Prüfung ist; Zeitmanagement — Zeitliche Annahmen der Themen — Vorlesung wirkte bis jetzt etwas unstrukturiert — Theorievorlesung zu umfangreich! Mehr Zeit für App-Entwicklung wäre

besser — Für BWL Bachelor Studenten ist die Vorlesung viel zu anspruchsvoll

und es ist kaum möglich der Veranstaltung zu folgen (2. Teil der Vorlesung) ohne Daheim extrem viel zu investieren. Es kommt mir nicht gerecht vor.

— Das benötigte Vorwissen ist recht hoch. Wer noch nie programmiert hat kann unmöglich folgen.

— Es geht (für mich) in erster Linie um Programmierung. Theorie zu Open Data ist viel zu umfangreich. Zeitplanung: 1. Grundlagen D3 anschliessend 2. Open Data Theorie

FS 2014


19

Kommentare

> Was fanden Sie an dieser Veranstaltung besonders schlecht? — Für die Programmieraufgabe steht zu wenig Zeit zur Verfügung (45h in

der Hälfte des Semesters) — Unterschied zwischen Basics in Programmieren und Programmieren

einer komplexen App in wenigen Wochen viel zu hoch! -> für mich nicht erfolgreich

— Zu spät ins Programmieren eingestiegen — Qualität der Gastvorträge war zum Teil nicht überzeugend;

"Zeitverschwendung" durch nebensächliche Theorie, anstatt direkt mit den zentralen Aspekten (Programmieren der App und Wissen davon) zu beginnen; Theorie an sich gut (für programmieren), aber 1:1 vom Buch ; eventuell von Anfang an lesen; das Buch angeben [?]

— Zumutung dass BWL-Studenten in so kurzer Zeit eine Programmiersprache erlernen können

— Ich habe immer noch das Gefühl, dass von uns zu viel erwartet wird, was das Programmieren betrifft.

FS 2014


20

Kommentare

> Was fanden Sie an dieser Veranstaltung besonders schlecht? — Programmierung hätte früher Teil der Vorlesung sein können. — Data Coaches wussten bei der Präsentation teils nicht wirklich was von

den Studenten gefordert ist (jemand wollte eine iPhone App) — Eigentlich wären ja keine Programmierkenntnisse vorausgesetzt. Da

ich über ein minimes Basiswissen verfüge, verstand ich zwar, wovon gesprochen wurde. Das Meiste musst ich mir aber selber erarbeiten bzw. nachholen, da ich zunächst völlig überfordert war und nur Bahnhof verstand. Dass man nicht von Anfang an wusste, welches Fachwissen in der Vorlesung gefordert wird und erst von den Anforderungen des Programmierens erfuhr, als man sich schon definitiv dafür entschieden hat, fand ich nicht fair. Zumal der grösste Teil der Studierenden gemäss meiner Beobachtung enorme Programmierkenntnisse besitzen.

— Man hätte zuerst eine Einführung in den praktischen Teil geben sollen (Bottom up)

FS 2014


21

Kommentare

> Was fanden Sie an dieser Veranstaltung besonders schlecht? — Das Niveau von Informatikern und BWLer is sehr unausgeglichen. Der

Aufwand ist sehr unterschiedlich. Ich finde die App nimmt schon sehr viel Zeit in Anspruch, Prüfung sollte weggelassen werden.

— Aus meiner Sicht ist der Stoff zu umfangreich für eine 4.5 ECTS Veranstaltung

— Time Management der Vorlesung — Redner der Gastvorträge waren oft sehr schlecht vorbereitet. Teilweise

wusste man nicht einmal was vermittelt werden sollte. HTML, CSS und JavaScript Einführung war sehr oberflächlich.

FS 2014


22

Kommentare

> Haben Sie Anregungen zur Verbesserung? — Ziele deutlicher formulieren — Früher mit praktischem Teil beginnen — Zeitplan überarbeiten. Gewisse Inputs sind später interessanter, da Open

Data & Co. dann klarer verstanden wird. — Bei der Veranstaltungsausschreibung sollten sowohl geringe

Programmierkenntnisse als auch ein Verständnis für Datenbanken als Voraussetzung angegeben werden.

— Die Reihenfolge ist problematisch. Wenn wir zuerst langsamer ins Programmieren einsteigen würden, hätten wir bereits viel mehr Vorwissen [?]

— Beim nächsten Mal würde ich die Einführung ins Programmieren zu Beginn machen und vielleicht sogar zusätzliche Übungslektionen anbieten

— In Zukunft sollten nur Studierende mit Programmierkenntnissen daran teilnehmen dürfen.

FS 2014


23

Kommentare

> Haben Sie Anregungen zur Verbesserung? — Folien dürften weniger überladen sein. — Weniger Stoff (Schwerpunkte setzen: weniger Theori/Gastvorträge und

viel Programmieren oder umgekehrt) — Man könnte von Beginn an mit dem Programmieren anfangen und

nicht erst in Woche 7 wo man es anwenden sollte. — App-Programmierung sollte früher begonnen werden. Die Theorie-

Hälfte über Open Data könnte nach einer Einführung in der zweiten Hälfte des Semesters gemacht werden, damit man länger Zeit hat für die Apps.

— Vielleicht kleines Vorprojekt zum einarbeiten. — Umstrukturierung der Vorlesung -> praxisrelevante Vorlesungen am

Anfang des Semesters — Wenig umfangreiche Schlussprüfung, da App-Entwickung viel Aufwand

erforderte

FS 2014


24

Kommentare

> Haben Sie Anregungen zur Verbesserung? — Podcasts nicht deutlich aufgenommen — Programmierteil am Anfang und dann erst "Infoveranstaltungen"

(Gastreferate) — Es ist schwierig den HTML-Text einer bereits bestehenden Applikation

(kopiert aus D3-Bibliothek) zu verstehen und allfällige Ungereimtheiten mit eigenen Daten zu ... [?]

— Mehr Zeit für praktischen Teil. — Allgemeine Theorie (erster Teil) ist eigentlich nicht so relevant -> kürzer

halten; Prüfung notwendig? — Direkt mit der App beginnen, da die Zeit eh knapp ist und dies der

zentrale Aspekt der Vorlesung ist. — In der Kursbeschreibung "erste Programmiererfahrungen" voraussetzen — Oder neuen Kurs "Einführung in D3" nur für BWL-Studenten ohne

Informatiker -> nicht mischen

FS 2014


25

Kommentare

> Haben Sie Anregungen zur Verbesserung? — Programmiereinführung kam viel zu spät. Der Aufwand staut sich am Ende

der Vorlesung auf. Prüfung am Ende wäre nicht zusätzlich notwendig. — Klarer zeigen was ein Student am Ende fähig ist zu erzeugen — App statt Prüfung — Statt jede Stunde einen Gastvortrag könnte man früher mit dem Hacking

beginnen -> würde etwas Zeitdruck nehmen, z.B. erste Lektion Open Data Theorie und zweite Lektion programmieren

— Grundsatztheorie zur Programmierung der App sollte früher in der Vorlesung vermittelt werden. Die Gastvorträge können auch am Schluss der Vorlesung kommen.

— Theorie Open Data um 50% senken. Zuerst Programmiereinführung und anschliessend nach und nach Theorie dazu.

— Ich würde die Veranstaltung in zwei Vorlesungen teilen: 1. Theoretische Aspekte von Open Data, 2. Programmierung und App Entwicklung

FS 2014


26

Reminder zur App-Präsentation

FS 2014


27

Infos zur Open Data App

> Kurzpräsentation in der Vorlesung vom Donnerstag, 22. Mai 2014 ist Voraussetzung für Anrechnung und Note. Mindestens eine Person muss anwesend sein. App zählt 50% der Note, Prüfung zählt 50% der Note.

> Minimalanforderungen an die App (für Note "genügend"): 1. Neue Daten aufbereiten und visualisieren (Data Coach, Datenportal, eigene Daten) 2. Mindestens eine kreative Visualisierung, nicht bloss Balken oder Kuchendiagramm 3. Mindestens eine interaktive Funktion (Hover, Mouse Click, Scroll Wheel, Button etc.) 4. Aufwand von rund 40 bis 50 Stunden pro Person muss erkennbar sein

> Bewertungskriterien: 1. Komplexität: Wie anspruchsvoll sind die visualisierten Daten und der behandelte

Themenkomplex als ganzes? 2. Kreativität: Wie neuartig und attraktiv sind die Visualisierung der Daten und

technische Implementierung der Open Data App? 3. Umsetzung: Wie benutzerfreundlich, verständlich und gut dokumentiert ist die Open

Data App? 4. Impact: Wie hoch ist die Bedeutung und die Aussagekraft der Datenvisualisierung

und der Open Data App als gesamtes?

FS 2014


28

Vorgehen Präsentationen Open Data App

> Folien zu den 5 Punkten: 1. Team (wer, welchen Hintergrund, Foto) 2. Ziel, Motivation (Aufgabestellung) 3. Resultat (mit öffentlich zugänglichem Link) 4. Datenquellen (Ursprungsformat, Endformat) 5. Vorgehen (notwendige Schritte)

> Kurze Live App-Demo

> Zeitvorgabe: maximal 4 Minuten! (je nach Anzahl Apps mehr)

> Anmeldung für Kurzpräsentation: Mail an Rahel Winkelmann [email protected] bis 20. Mai 2014 mit den Folien als PowerPoint oder PDF

mailto:[email protected]

FS 2014


29

Jury

> Bis jetzt angemeldete Jury-Mitglieder: 1. André Golliez, Präsident Opendata.ch 2. Juan Pablo Lovato, Projektleiter OGD, Bundesverwaltung 3. Julian Schmidli, Datenjournalist SonntagsZeitung 4. Michael Erne, Smartvote 5. Daniel Studer, Statistik Kanton Bern 6. Bora Günaydin, CEO Montemedia 7. Khôi Tran, Open Data Entwickler am IWI

> Finale Benotung durch Thomas Myrach und Matthias Stürmer

> Geeignete Apps werden im Tagesanzeiger-Datenblog vorgestellt: http://blog.tagesanzeiger.ch/datenblog/

http://blog.tagesanzeiger.ch/datenblog/

FS 2014


30

Universität Bern – Nacht der Forschung

FS 2014


31

Nacht der Forschung der Uni Bern

> Samstag, 6. September 2014 16 Uhr bis 23 Uhr

> 2012 kamen rund 7000 Besuchende

> Open Data Hacknight: — Den Besuchenden die Apps aus der

Vorlesung vorstellen — Zusammen mit anderen Open Data

ProgrammiererInnen an den Apps weiterentwickeln

— App-Ideen der Besuchenden versuchen umzusetzen

> Bitte bei Matthias Stürmer anmelden: [email protected]

mailto:[email protected]

FS 2014


32

Masterarbeiten zu Open Government Data

FS 2014


33

Gebührenpolitik

> Masterarbeit bezüglich Analyse der Gebührenauswirkungen von Open Government Data: — Analyse der heutigen Gebühren — Überblick über die gesetzlichen

Rahmenbedingungen — Darstellen der Geschäftsmodelle

> Weitere Infos:

— Interdisziplinäre Masterarbeit ab sofort, Betreuung Matthias Stürmer — In Zusammenarbeit mit Geschäftsstelle E-Government Schweiz, BVerw. — Möglicherweis wird temporärer Arbeitsplatz innerhalb der

Bundesverwaltung zur Verfügung gestellt — Detaillierte Ausschreibung:

http://www.iwi.unibe.ch/content/studium/bachelor__und_masterarbeiten/themenvorschlaege_master/index_ger.html

http://www.iwi.unibe.ch/content/studium/bachelor__und_masterarbeiten/themenvorschlaege_master/index_ger.html

FS 2014


34

Weitere Masterarbeit-Themen

> Welche Behördendaten sind ideale Open Government Data Kandidaten? — Anwendung KDZ Open-Government-Vorgehensmodell bezüglich

Datenmonitoring — Priorisierung der Datensätze

> Was ist das wirtschaftliche Potential von Open Government Data in der Schweiz? — Volkswirtschaftliche Aspekte — Basierend auf bestehenden Studien

> Wie kann bei Behörden eine Kultur von Open Data gefördert werden? — Ownership von Daten — Wandel bezüglich Ort wo die Stellen und Personen ihre Daten ablegen

FS 2014


35

Agenda

1. Evaluation, App-Reminder, Nacht der Forschung, Masterarbeiten

2. Datenaktualisierung und Transitionen

FS 2014


36

Updating Data

> The simplest kind of update is when all data values are updated at the same time and the number of values stays the same.

1. Modify the values in your dataset.

2. Rebind the new values to the existing elements (thereby overwriting the original values).

3. Set new attribute values as needed to update the visual display.

> Before any of those steps can happen, though, some event needs to kick things off.

> We will need a “trigger,” something that happens after page load to apply the updates. How about a mouse click?

FS 2014


37

Interaction via Event Listeners

The listener listens for a click event occurring on our selection p. When that happens, the listener function is executed: d3.select("p") .on("click", function() { //Do something mundane and annoying on click alert("Hey, don't click that!"); });

FS 2014


38

Changing the Data

Update dataset by overwriting its original values: //On click, update with new data d3.select("p") .on("click", function() { //New values for dataset dataset = [ 11, 12, 15, 20, 18, 17, 16, 18, 23, 25, 5, 10, 13, 19, 21, 25, 22, 18, 15, 13 ]; //Update all rects svg.selectAll("rect") .data(dataset) .attr("y", function(d) { return h - yScale(d); }) .attr("height", function(d) { return yScale(d); }); });

The rects can maintain their horizontal positions and widths; all we really need to update are their heights and y positions. Link

http://examples.oreilly.com/0636920026938/chapter_09/03_updates_all_data.html

FS 2014


39

Fixing Labels and Colors

We forgot to update the bar colors. Fix it by copy-paste from above: .attr("fill", function(d) { return "rgb(0, 0, " + (d * 10) + ")"; });

And we forgot to update the labels. Fix it by copy-paste from above: svg.selectAll("text") .data(dataset) .text(function(d) { return d; }) .attr("x", function(d, i) { return xScale(i) + xScale.rangeBand() / 2; }) .attr("y", function(d) { return h - yScale(d) + 14; }); Link

http://examples.oreilly.com/0636920026938/chapter_09/04_updates_all_data_fixed.html

FS 2014


40

Transitions

> A transition is a special type of selection where the operators apply smoothly over time rather than instantaneously.

> Transitions may have per-element delays and durations, computed using functions of data similar to other operators.

> Why do transitions? To better explain your data! > For example, you can sort

elements and then stagger the transition for better perception of element reordering during the transition: Heer and Robertson, 2007

> More examples

Source: https://github.com/mbostock/d3/wiki/Transitions http://vis.berkeley.edu/papers/animated_transitions/

http://blog.visual.ly/creating-animations-and-transitions-with-d3-js/

https://github.com/mbostock/d3/wiki/Transitions



http://vis.berkeley.edu/papers/animated_transitions/



FS 2014


41

Use transition()

Insert transition() below where your selection is made, and above where any attribute changes are applied: //Update all rects svg.selectAll("rect") .data(dataset) .transition() // <-- This is new! .attr("y", function(d) { return h - yScale(d); }) .attr("height", function(d) { return yScale(d); }) .attr("fill", function(d) { return "rgb(0, 0, " + (d * 10) + ")"; });

Link

http://examples.oreilly.com/0636920026938/chapter_09/05_transition.html

FS 2014


42

About transition()

> Without transition(), D3 evaluates every attr() statement immediately, so the changes in height and fill happen right away.

> When you add transition(), D3 introduces the element of time.

> Rather than applying new values all at once, D3 interpolates between the old values and the new values, meaning it normalizes the beginning and ending values, and calculates all their in-between states.

> D3 is also smart enough to recognize and interpolate between different attribute value formats.

> For example, if you specified a height of 200px to start but transition to just 100 (without the px). Or if a blue fill turns rgb(0,255,0).

> You don’t need to fret about being consistent; D3 takes care of it.

FS 2014


43

How to fine-tune transitions

> Duration of a transition: .duration(1000) (in milliseconds)

> Type of motion: .ease("VALUE") — cubic-in-out (default): produces gradual acceleration and deceleration — linear: there is no gradual acceleration and deceleration—the elements

simply begin moving at an even pace, and then they stop abruptly. — circle: Gradual ease in and acceleration until elements snap into place. — elastic: The best way to describe this one is “sproingy.” [elastisch] — bounce: Like a ball bouncing, then coming to rest.

> Short break: .delay(1000) (in milliseconds)

http://examples.oreilly.com/0636920026938/chapter_09/08_duration_slow_labels_fixed.html

http://examples.oreilly.com/0636920026938/chapter_09/09_ease_linear.html

http://examples.oreilly.com/0636920026938/chapter_09/09_ease_linear.html

http://examples.oreilly.com/0636920026938/chapter_09/10_ease_circle.html

http://examples.oreilly.com/0636920026938/chapter_09/11_ease_elastic.html

http://examples.oreilly.com/0636920026938/chapter_09/12_ease_bounce.html

http://examples.oreilly.com/0636920026938/chapter_09/14_delay_dynamic.html

FS 2014


44

This is the end!

Jetzt letztes Programming Coaching,

danach Feinschliff der App, bis 20. Mai Folien an Rahel,

am 22. Mai Open Data App Präsentationen, am 5. Juni Prüfung

open data: datenmanagement und visualisierung … · 2020-02-07 · fs 2014 open data > 12:...

Documents