Skip to content

Instantly share code, notes, and snippets.

@baderone
baderone / index.html
Last active July 6, 2016 09:29
Responsive Chord
<!DOCTYPE html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<meta charset="utf-8">
<!-- affinity group data, circle rotation, auto-resize svg image, chord function, configuration -->
<title>Chord Diagram - Nepal migration visualization</title>
<style>
@baderone
baderone / README.md
Last active January 21, 2016 20:03
Kursbeispiel - Livia - WEBMAP 2016

Ein Beispiel von Mittwoch Nachmittag

@baderone
baderone / County.topojson
Last active April 20, 2018 14:18
Kursbeispiel - Kenya County Map Test - WEBMAP 2016
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@baderone
baderone / README.md
Last active January 21, 2016 08:45
02.1 Kursbeispiel - Adding tooltip II - WEBMAP 2016

Versucht den Tooltip lesbarer zu machen. Beispielsweise Jahr: xxxx, Schuldden: xxxxx$

@baderone
baderone / README.md
Created January 20, 2016 08:19
04 Kursbeispiel - Multiple Lines and series - WEBMAP 2016

In diesem Beispiel werden mehrere Länder dargestellt sowie zwei verschiedene Datensätze. Diese Beispiel könnt Ihr beliebig weiterentwickeln mit mehr Ländern oder Datensätzen

@baderone
baderone / README.md
Last active January 19, 2016 08:31
03 Kursbeispiel - Two Lines - WEBMAP 2016

Nun wollen wir eine zweite Datenlinie einfügen.

  1. Sucht Euch ein zweites Land aus der Datenbank aus
  2. Erstellt ein zweite .csv Datei
  3. Passt den Code so an, dass er für eure ausgesuchten Länder passt
@baderone
baderone / README.md
Last active January 19, 2016 08:30
02 Kursbeispiel - Adding Tooltip - WEBMAP 2016

Dieser Code zeigt den Standard Tooltip (html) ohne einfache Möglichkeit zur Anpassung.

  1. Versucht bei Eurem Beispiel ein Tooltip einzufügen

Unter dem nachfoldenen Link findet Ihr eine Anleitung wie man tooltips auf eine andere Art einfügen kann. Diese Art hat den Vorteil, dass man das Aussehen des tooltips einfacher nach eigenen Wünschen anpassen kann.

  1. Lest die Anleitung durch und versucht bei Eurem Beispiel den Tooltip auf diese zweite mögliche Art und Weise einzubinden

http://www.d3noob.org/2013/01/adding-tooltips-to-d3js-graph.html?m=1

@baderone
baderone / README.md
Last active January 20, 2016 09:02
01 Kursbeispiel - Line Chart - WEBMAP 2016

D3 js based example for line chart used for students course on webvisualizations - WEBMAP 2016

Die Daten findet Ihr hier: http://data.worldbank.org/indicator/DT.TDS.MLAT.CD

  1. Speichert die Daten auf eurem PC
  2. Sucht euch ein Land aus
  3. Formatiert die Daten analog debt_bolivia.csv
  4. Passt das Beispiel gemäss dem ausgewählten Land an
  5. Versucht selbständig einen y-Axen Titel hinzuzufügen Tipp: google, "d3 add axis title"
@baderone
baderone / README.md
Last active September 23, 2015 07:57
Grisons boost in tourism

The chart shows a impressive increase of tourist arrivals in Grisons beginning in the year 2011. The Canton of Grisons managed to almost triple the arrivals of Swiss tourists. Furthermore, we see that before 2011 only few Japanese tourist visited Grisons. Nowadays, Grisons welcomes Japanese tourist during the Summer. Another interesting observation is the fact that Swiss tourist prefer Winter holidays whereas Japanese tourists prefer the Summer over the Winter.

@baderone
baderone / README.md
Last active September 16, 2015 05:34
The longer the journey, the shorter the stay?

Scatterplot from the top 15 countries of origin of tourists in Grisons, Switzerland in June 2015. The Scatterplot shows the relation of travel distance and lenght of stay. The chart shows that tourists from Australia stay 1.5 nights in average whereas tourist from Belgium stay more than 6 nights in average.