-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
76 lines (67 loc) · 5.83 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
<!-- Your CSS files -->
<link rel="stylesheet" href="style/app.css">
<!-- google fonts: Roboto Condensed(super-font) and Lora(sub-font) -->
<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Lora:400,400i,700" rel="stylesheet">
<title>Jan's Data Studio Project Page</title>
</head>
<body class="light-theme">
<div class="container"><!-- start of the main container-->
<div class="row justify-content-center"><!-- headline and intro -->
<div class="col-lg-10 ">
<p class="kicker super-font">Columbia Lede Program 2018</p>
<h1 class="headline super-font">Jan's Data Studio Project Page</h1>
<p class="body-text sub-font">This page collects visualization and data analysis projects I did while attending the Lede Program 2018.<br>All related code is in <a href="https://github.com/jlstro/Data-Studio/tree/master/code"> the repository</a>.
</p>
</div>
</div>
<!-- start of one size B image -->
<div class="row justify-content-center"> <!-- labels/deszcriptions and three charts for mobile -->
<div class="col-md-10"><!-- left -->
<p class="label super-font">Data Studio Project 4: Gender bias in Spiegel Online texts (WORK IN PROGRESS)</p>
<p class="label-text super-font">I scraped a total of six years of <a href="http://www.spiegel.de/">Spiegel Online</a> articles and categorized them into. The results are summarized in <a href="/Data-Studio/code/04-spon_gender/page/index.html">this project</a>. <br>The code is <a href="https://github.com/jlstro/Data-Studio/tree/master/code/04-spon_gender">here.</a></p>
<a href="/Data-Studio/code/04-spon_gender/page/index.html"><img class="image" src="style/images/04-spon_gender.png" alt="screenshot of the project page" ></a>
</div>
</div>
<!-- start of one size B image -->
<div class="row justify-content-center"> <!-- labels/deszcriptions and three charts for mobile -->
<div class="col-md-10"><!-- left -->
<p class="label super-font">Data Studio Project 3: Internet connection speed visualization (WORK IN PROGRESS)</p>
<p class="label-text super-font">Once upon a time, a provider promised me <i>up to 100 Mbit/s</i>, but this <a href="/Data-Studio/code/03-speedtest/page/index.html">project</a> shows that it is nothing more than a broken dream.<br>Have a look at <a href="https://github.com/jlstro/Data-Studio/tree/master/code/03-speedtest">code here.</a></p>
<a href="/Data-Studio/code/03-speedtest/page/index.html"><img class="image" src="style/images/03-speedtest.png" alt="screenshot of the project page" ></a>
</div>
</div>
<!-- start of one size B image -->
<!-- start of one size B image -->
<div class="row justify-content-center"> <!-- labels/deszcriptions and three charts for mobile -->
<div class="col-md-10"><!-- left -->
<p class="label super-font">Data Studio Project 2: Germany eats!</p>
<p class="label-text super-font">What do Germans like to eat? This <a href="/Data-Studio/code/02-chefanalyse/page/index.html">project</a> takes a look at recipe data from Germany's largest online cooking community, <i>Chefkoch.de</i>. <br>See the <a href="https://github.com/jlstro/Data-Studio/tree/master/code/02-chefanalyse">code here.</a></p>
<a href="/Data-Studio/code/02-chefanalyse/page/index.html"><img class="image" src="style/images/data02.png" alt="screenshot of the project page" ></a>
</div>
</div>
<!-- start of one size B image -->
<div class="row justify-content-center"> <!-- labels/deszcriptions and three charts for mobile -->
<div class="col-md-10"><!-- left -->
<p class="label super-font">Data Studio Project 1: Startup Funding</p>
<p class="label-text super-font">For <a href="/Data-Studio/code/01-startups/page/index.html">this project</a>, I scraped data on startup funding and compared the results across industries and regional areas. <br>See the <a href="https://github.com/jlstro/Data-Studio/tree/master/code/01-startups">code here.</a></p>
<a href="/Data-Studio/code/01-startups/page/index.html"><img class="image" src="style/images/data01.png" alt="screenshot of the project page" ></a>
</div>
</div>
<!-- start of one size B image -->
<div class="row justify-content-center"> <!-- labels/deszcriptions and three charts for mobile -->
<div class="col-md-10"><!-- left -->
<p class="label super-font">Data01: Blood Plasma Centers in the US</p>
<p class="label-text super-font">Technically not a Data Studio project, but from the class begore. <a href="/Data-Studio/code/00-blood_map/page/map.html">This map</a> shows the locations of blood plasma donation centers in the US and 4 key economic indicators for the US counties as choropleth map. <br>I used leaflet.js for the map, Selenium for scraping the data and Pandas for the data wrangling. I also did some calculations in QGIS. See the <a href="https://github.com/jlstro/Data-Studio/tree/master/code/00-blood_map">code here.</a></p>
<a href="/Data-Studio/code/00-blood_map/page/map.html"><img class="image" src="style/images/00-blood_map.png" alt="screenshot of the project page" ></a>
</div>
</div>
</body>