diff --git a/projects/project1/index.html b/projects/project1/index.html
new file mode 100644
index 0000000..76662a7
--- /dev/null
+++ b/projects/project1/index.html
@@ -0,0 +1,22 @@
+
+
+
+
+ GeoVis - Project 1
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/projects/project1/script.js b/projects/project1/script.js
new file mode 100644
index 0000000..49268e0
--- /dev/null
+++ b/projects/project1/script.js
@@ -0,0 +1,139 @@
+let dataset = {
+ 2012: [128.52, 187.54, 63.16, 72.18, 0, 0, 0, 0, 6, 68.58, 84.54, 120.51], //Month from Jan to Dec
+ 2013: [144.44, 133.07, 121.78, 38.27, 35.53, 18.57, 0, 0, 16.56, 48.53, 91.88, 115.2], //Month from Jan to Dec
+ 2014: [113.77, 96.17, 77.74, 38.27, 29.79, 11.6, 0, 0, 16.85, 36.14, 67.55, 138] //Month from Jan to Dec
+}
+
+function lookupMonth(num, short = false) {
+ if (short) {
+ return ["Jan", "Feb", "Mrz", "Apr", "Mai", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dez"][num]
+ }
+ return ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"][num]
+}
+
+function drawPieChartYear() {
+ let pieChartData = google.visualization.arrayToDataTable([
+ ["Jahr", "MWh"],
+ ["2012", dataset["2012"].reduce((acc, curr) => acc + curr)],
+ ["2013", dataset["2013"].reduce((acc, curr) => acc + curr)],
+ ["2014", dataset["2014"].reduce((acc, curr) => acc + curr)]
+ ])
+
+ let chart = new google.visualization.PieChart(document.getElementById("piechartYear"))
+ chart.draw(pieChartData, {
+ title: "Wärmebedarf 2012 - 2014 (in MWh)",
+ colors: ["#0040ff", "#ff0000", "#155a00"],
+ height: 300,
+ width: 800
+ })
+}
+
+function drawPieChartMonth() {
+ let parsedData = []
+ for (let i = 0; i < 12; i++) {
+ parsedData.push([lookupMonth(i), dataset["2012"][i] + dataset["2013"][i] + dataset["2014"][i]])
+ }
+
+ let pieChartData = google.visualization.arrayToDataTable([
+ ["Monat", "MWh"],
+ ...parsedData
+ ])
+
+ let chart = new google.visualization.PieChart(document.getElementById("piechartMonth"))
+ chart.draw(pieChartData, {
+ title: "Akkumulierter Wärmebedarf 2012 - 2014 pro Monat (in MWh)",
+ height: 300,
+ width: 800
+ })
+}
+
+function drawLineChart() {
+ let parsedData = []
+
+ for (let i = 0; i < 12; i++) {
+ parsedData.push([lookupMonth(i), dataset["2012"][i], dataset["2013"][i], dataset["2014"][i]])
+ }
+
+ let lineChartData = google.visualization.arrayToDataTable([
+ ["Monat", "2012", "2013", "2014"],
+ ...parsedData
+ ])
+
+ let chart = new google.visualization.LineChart(document.getElementById("linechart"))
+ chart.draw(lineChartData, {
+ title: "Wärmebedarf 2012 - 2014 (in MWh)",
+ colors: ["#0040ff", "#ff0000", "#155a00"],
+ height: 300,
+ width: 800
+ })
+}
+
+function drawScatterChart() {
+ let parsedData = []
+
+ for (let i = 0; i < 12; i++) {
+ parsedData.push([lookupMonth(i), dataset["2012"][i], dataset["2013"][i], dataset["2014"][i]])
+ }
+
+ let data = new google.visualization.arrayToDataTable([
+ ["Monat", "2012", "2013", "2014"],
+ ...parsedData
+ ])
+
+ let options = {
+ chart: {
+ title: "Wärmebedarf 2012 - 2014 (in MWh)"
+ },
+ colors: ["#0040ff", "#ff0000", "#155a00"],
+ vAxis: {title: "MWh"},
+ hAxix: {title: "Month"},
+ height: 300,
+ width: 800
+ }
+ let chart = new google.charts.Scatter(document.getElementById("scatterchart"))
+ chart.draw(data, google.charts.Scatter.convertOptions(options))
+}
+
+function drawBubbleChart() {
+ let parsedData = []
+
+ for (let year in dataset) {
+ let complete = dataset[year].reduce((acc, curr) => acc + curr)
+ dataset[year].forEach((value, idx) => {
+ parsedData.push([
+ lookupMonth(idx, true), idx + 1, (value / complete) * 100, year, value
+ ])
+ })
+ }
+
+ let data = google.visualization.arrayToDataTable([
+ //BubbleName, X-Axis, Y-Axis, Series/Color, BubbleSize
+ ["Monat", "Monat", "Prozent des Jahresverbrauchs", "Jahr", "MWh"],
+ ...parsedData
+ ]);
+
+ let options = {
+ title: "Wärmebedarf 2012 - 2014 (in MWh)",
+ hAxis: {
+ title: "Monat",
+ ticks: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13]
+ },
+ vAxis: {
+ title: "Prozentualer MWh Anteil"
+ },
+ colors: ["#0040ff", "#ff0000", "#155a00"],
+ bubble: {textStyle: {fontSize: 11}},
+ height: 300,
+ width: 800
+ };
+
+ let chart = new google.visualization.BubbleChart(document.getElementById("bubblechart"));
+ chart.draw(data, options);
+}
+
+google.charts.load("current", {packages: ["corechart", "scatter"]})
+google.charts.setOnLoadCallback(drawPieChartYear)
+google.charts.setOnLoadCallback(drawPieChartMonth)
+google.charts.setOnLoadCallback(drawLineChart)
+google.charts.setOnLoadCallback(drawScatterChart)
+google.charts.setOnLoadCallback(drawBubbleChart)
\ No newline at end of file