Skip to content
GitLab
You need to sign in or sign up before continuing.
Commit 891ee8fb authored by Rushikesh Padsala's avatar Rushikesh Padsala
Browse files

Added Chart.js to Leaflet.js

parent d8909462
Hide whitespace changes
Inline Side-by-side
Exercise 1/index.html
View file @ 891ee8fb
<html> <html>
<head> <head>
<title>Building - Heat Demand</title> <title>Building - Heat Demand</title>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
...@@ -11,10 +9,10 @@ ...@@ -11,10 +9,10 @@
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"
integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
crossorigin=""></script> crossorigin=""></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="building_data.js"></script> <script src="building_data.js"></script>
<link rel="stylesheet" href="index.css"> <link rel="stylesheet" href="index.css">
<style> <style>
body { body {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
...@@ -34,15 +32,16 @@ ...@@ -34,15 +32,16 @@
} }
</style> </style>
</head> </head>
<body> <body>
<div id="map-container"> <div id="map-container">
<div id="mapid"></div> <div id="mapid"></div>
</div> </div>
<div id="chart-container"> <div id="chart-container">
<canvas id="yocChart"></canvas> <canvas id="yocChart"></canvas>
</div> </div>
<script>
<script>
var mymap = L.map('mapid').setView([48.79205, 9.20758], 16); var mymap = L.map('mapid').setView([48.79205, 9.20758], 16);
var OpenStreetMap_DE = L.tileLayer('https://{s}.tile.openstreetmap.de/tiles/osmde/{z}/{x}/{y}.png', { var OpenStreetMap_DE = L.tileLayer('https://{s}.tile.openstreetmap.de/tiles/osmde/{z}/{x}/{y}.png', {
maxZoom: 18, maxZoom: 18,
...@@ -91,7 +90,10 @@ ...@@ -91,7 +90,10 @@
onEachFeature: onEachFeature, onEachFeature: onEachFeature,
style: style, style: style,
}).addTo(mymap); }).addTo(mymap);
// Retrieve the building year of construction data from the GeoJSON
// Retrieve the building year of construction data from the GeoJSON
var buildingYoc = building_data.features.map(function(feature) { var buildingYoc = building_data.features.map(function(feature) {
return feature.properties.Year_of_co; return feature.properties.Year_of_co;
}); });
...@@ -146,12 +148,6 @@ var yocChart = new Chart(ctx, { ...@@ -146,12 +148,6 @@ var yocChart = new Chart(ctx, {
} }
}); });
</script> </script>
</body> </body>
</html> </html>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Dies ist die Gitlab-Instanz des Transferportals der Hochschule für Technik Stuttgart. Hier geht es zurück zum Portal