Skip to content
GitLab
Commit 319c0a8b authored by Santhanavanich's avatar Santhanavanich
Browse files

update

parent c4fa2d62
master
No related merge requests found
Pipeline #6075 passed with stage
in 6 seconds
Hide whitespace changes
Inline Side-by-side
Showing
with 75 additions and 82 deletions
+75 -82
public/application/img/demo.jpg 0 → 100644
+ 0
- 0
View file @ 319c0a8b
public/application/img/demo.jpg

316 KB

public/application/img/iCity_Banner_Logos.webp 0 → 100644
+ 0
- 0
View file @ 319c0a8b
public/application/img/iCity_Banner_Logos.webp

18.2 KB

public/application/index.html
+ 5
- 50
View file @ 319c0a8b
...@@ -28,52 +28,9 @@ ...@@ -28,52 +28,9 @@
<div class="row" style="overflow: hidden; margin: 0px"> <div class="row" style="overflow: hidden; margin: 0px">
<div class="col" id="cesiumContainer"> <div class="col" id="cesiumContainer">
<div class="card-body cesiumLegend" id="HeatDemand-legend" style="display: none">
<!-- <h5 class="card-title">Electricity supply from the grid</h5> -->
<h6>Legend </h6>
<small>Heat Demand kW⋅h<sub>th</sub> </small> <br>
<span class="dot" style="background-color: #3f007d"></span> >= 24568<br>
<span class="dot" style="background-color: #54278f"></span> 22620 - 24568<br>
<span class="dot" style="background-color: #6a51a3"></span> 20673 - 22620<br>
<span class="dot" style="background-color: #807dba"></span> 18726 - 20673<br>
<span class="dot" style="background-color: #9e9ac8"></span> 16779 - 18726<br>
<span class="dot" style="background-color: #bcbddc"></span> 14832 - 16779<br>
<span class="dot" style="background-color: #dadaeb"></span> 12884 - 14832<br>
<span class="dot" style="background-color: #efedf5"></span> 10937 - 12884<br>
<span class="dot" style="background-color: #fcfbfd"></span> 0 - 10937<br>
<!-- <span class="dot" style="background-color: #e8f1f2"></span> No Data<br> -->
<br>
</div>
<div class="card-body cesiumLegend" id="PVPotential-legend" style="display: none"> <div class="card-body cesiumLegend" id="PVPotential-legend" style="display: none">
<!-- <h5 class="card-title">Electricity supply from the grid</h5> -->
<h6>Legend </h6>
<small>PV Potential kW⋅h<sub>el</sub> </small> <br>
<span class="dot" style="background-color: #00441b"></span> >= 10615 <br>
<span class="dot" style="background-color: #006d2c"></span> 9615 - 10615 <br>
<span class="dot" style="background-color: #238b45"></span> 8615 - 9615 <br>
<span class="dot" style="background-color: #41ab5d"></span> 7615 - 8615 <br>
<span class="dot" style="background-color: #74c476"></span> 6615 - 7615 <br>
<span class="dot" style="background-color: #a1d99b"></span> 5615 - 6615 <br>
<span class="dot" style="background-color: #c7e9c0"></span> 4615 - 5615 <br>
<span class="dot" style="background-color: #e5f5e0"></span> 3615 - 4615<br>
<span class="dot" style="background-color: #f7fcf5"></span> 0 - 3615<br>
<!-- <span class="dot" style="background-color: #e8f1f2"></span> No Data<br> -->
<br>
</div> </div>
<div class="card-body cesiumLegend" id="ElecDemand-legend" style="display: none"> <div class="card-body cesiumLegend" id="PVSpecificYield-legend" style="display: none">
<!-- <h5 class="card-title">Electricity supply from the grid</h5> -->
<h6>Legend </h6>
<small>Elec Demand kW⋅h<sub>el</sub></small> <br>
<span class="dot" style="background-color: #a63603"></span> >= 7229 <br>
<span class="dot" style="background-color: #e6550d"></span> 6229 - 7229 <br>
<span class="dot" style="background-color: #fd8d3c"></span> 5229 - 6229 <br>
<span class="dot" style="background-color: #fdae6b"></span> 4229 - 5229 <br>
<span class="dot" style="background-color: #fdd0a2"></span> 3229 - 4229 <br>
<span class="dot" style="background-color: #feedde "></span> 0 - 3229 <br>
<!-- <span class="dot" style="background-color: #e8f1f2"></span> No Data<br> -->
<br>
</div> </div>
</div> </div>
<div style="width: 30%; height: 100vh; overflow: scroll;"> <div style="width: 30%; height: 100vh; overflow: scroll;">
...@@ -83,16 +40,14 @@ ...@@ -83,16 +40,14 @@
<hr> <hr>
<!-- <h5>Select Building Classification Style </h5> <h5>Select Building Classification Style </h5>
<select class="form-select" id="BuildingStyleSelector"> <select class="form-select" id="BuildingStyleSelector">
<option value="HeatDemand">Heat Demand</option> <option value="AllWhite" selected>Default</option>
<option value="PVPotential">PV Potential</option> <option value="PVPotential">PV Potential</option>
<option value="ElecDemand">Elec Demand</option> <option value="PVSpecificYield">PV Specific Yield</option>
<option value="AllWhite" selected>All Buildings (in White)</option>
<option value="SimulatedBuildings">Simulated Buildings (in White)</option>
</select> </select>
<div id="chart"></div> <hr> --> <div id="chart"></div> <hr>
<h5>Building Shadow</h5> <h5>Building Shadow</h5>
......
public/application/js/cesium_00_Main.js
+ 62
- 25
View file @ 319c0a8b
...@@ -6,6 +6,47 @@ $(document).ready(function () { ...@@ -6,6 +6,47 @@ $(document).ready(function () {
// $("#cesiumContainer").css("width", "auto"); // $("#cesiumContainer").css("width", "auto");
// }); // });
}); });
var PVPotential_legend_context = `
<small class="font-weight-bold">PV Potential MWh/year </small> <br>
<span class="dot" style="background-color: #8C2D04"></span> > 30 <br>
<span class="dot" style="background-color: #CC4C02"></span> 25 - 30 <br>
<span class="dot" style="background-color: #EC7014"></span> 20 - 25 <br>
<span class="dot" style="background-color: #FE9929"></span> 15 - 20 <br>
<span class="dot" style="background-color: #FEC44F"></span> 10 - 15 <br>
<span class="dot" style="background-color: #FEE391"></span> 5 - 10<br>
<span class="dot" style="background-color: #FFFFD4"></span> 0 - 5<br>
<br>
`
// var PVPotential_legend_context = `
// <small class="font-weight-bold">PV Potential MW⋅h<sub>el</sub> </small> <br>
// <span class="dot" style="background-color: #F22E22"></span> >= 8 <br>
// <span class="dot" style="background-color: #F56D1F"></span> 7 - 8 <br>
// <span class="dot" style="background-color: #F9A717"></span> 6 - 7 <br>
// <span class="dot" style="background-color: #FECE02"></span> 5 - 6 <br>
// <span class="dot" style="background-color: #F6EC00"></span> 4 - 5 <br>
// <span class="dot" style="background-color: #D1E023"></span> 3 - 4 <br>
// <span class="dot" style="background-color: #B2D531"></span> 2 - 3 <br>
// <span class="dot" style="background-color: #A4C711"></span> 1 - 2<br>
// <span class="dot" style="background-color: #61B949"></span> 0 - 1<br>
// <br>
// `
if ($("#PVPotential-legend").length > 0) {
$("#PVPotential-legend").html(PVPotential_legend_context) // Add Bioenergy menu if the "#id" exist
}
var PVSpecificYield_legend_context = `
<small class="font-weight-bold">PV Specific Yield (kWh/kWp.year) </small> <br>
<span class="dot" style="background-color: #8C2D04"></span> > 1100 <br>
<span class="dot" style="background-color: #CC4C02"></span> 1050 - 1100 <br>
<span class="dot" style="background-color: #EC7014"></span> 1000 - 1050 <br>
<span class="dot" style="background-color: #FE9929"></span> 950 - 1000 <br>
<span class="dot" style="background-color: #FEC44F"></span> 900 - 950 <br>
<span class="dot" style="background-color: #FEE391"></span> 850 - 900<br>
<span class="dot" style="background-color: #FFFFD4"></span> < 850 <br>
<br>
`
if ($("#PVSpecificYield-legend").length > 0) {
$("#PVSpecificYield-legend").html(PVSpecificYield_legend_context) // Add Bioenergy menu if the "#id" exist
}
// set the Cesium ION token // set the Cesium ION token
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJkZTkyOTcyNC0yMGFkLTQ2ZjktODA5YS0xYjY1N2QwM2Y2ZmMiLCJpZCI6NDM2NDUsImlhdCI6MTYxMjkyNDgwNX0.12Xvbhtt_c2Y2RGA6J_J906Vdn1iOKZKPur0SASh-gk'; Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJkZTkyOTcyNC0yMGFkLTQ2ZjktODA5YS0xYjY1N2QwM2Y2ZmMiLCJpZCI6NDM2NDUsImlhdCI6MTYxMjkyNDgwNX0.12Xvbhtt_c2Y2RGA6J_J906Vdn1iOKZKPur0SASh-gk';
...@@ -69,37 +110,33 @@ var addBuilding = function () { ...@@ -69,37 +110,33 @@ var addBuilding = function () {
show: true, show: true,
color: "color('#ffffff')" color: "color('#ffffff')"
}); });
building_style["HeatDemand"] = new Cesium.Cesium3DTileStyle({ building_style["PVPotential"] = new Cesium.Cesium3DTileStyle({
pointSize: '3.0',
show: true, show: true,
color: { color: {
"conditions" : [ "conditions": [
// ["${Total_Yealy_Heat_DHW_Demand} == 0", "color('#fff')"], ['Number(${PV_potential_yield}) < 5', `color("#FFFFD4")`],
["${Total_Yealy_Heat_DHW_Demand} === 0", "color('#ffffff',0)"], ['Number(${PV_potential_yield}) < 10', `color("#FEE391")`],
['Number(${PV_potential_yield}) < 15', `color("#FEC44F")`],
["${Total_Yealy_Heat_DHW_Demand} < 10937", "color('#bcbddc')"], ['Number(${PV_potential_yield}) < 20', `color("#FE9929")`],
["${Total_Yealy_Heat_DHW_Demand} < 12884", "color('#9e9ac8')"], ['Number(${PV_potential_yield}) < 25', `color("#EC7014")`],
["${Total_Yealy_Heat_DHW_Demand} < 12884", "color('#807dba')"], ['Number(${PV_potential_yield}) < 30', `color("#CC4C02")`],
["${Total_Yealy_Heat_DHW_Demand} < 20673", "color('#6a51a3')"], ['Number(${PV_potential_yield}) >= 30', `color("#8C2D04")`],
["${Total_Yealy_Heat_DHW_Demand} < 22620", "color('#6a51a3')"], ["true", "color('#ffffff')"] //no data
["${Total_Yealy_Heat_DHW_Demand} < 24568", "color('#54278f')"],
["true", "color('#3f007d', 0.5)"]
] ]
} }
}); });
building_style["PVPotential"] = new Cesium.Cesium3DTileStyle({ building_style["PVSpecificYield"] = new Cesium.Cesium3DTileStyle({
pointSize: '3.0',
show: true, show: true,
color: { color: {
"conditions" : [ "conditions": [
["${PV_Potential_Yield} === 0", "color('#ffffff',0)"], ['Number(${PV_specific_yield}) < 850', `color("#FFFFD4")`],
["${PV_Potential_Yield} < 5615", "color('#c7e9c0')"], ['Number(${PV_specific_yield}) < 900', `color("#FEE391")`],
["${PV_Potential_Yield} < 6615", "color('#a1d99b')"], ['Number(${PV_specific_yield}) < 950', `color("#FEC44F")`],
["${PV_Potential_Yield} < 7615", "color('#74c476')"], ['Number(${PV_specific_yield}) < 1000', `color("#FE9929")`],
["${PV_Potential_Yield} < 8615", "color('#41ab5d')"], ['Number(${PV_specific_yield}) < 1050', `color("#EC7014")`],
["${PV_Potential_Yield} < 9615", "color('#238b45')"], ['Number(${PV_specific_yield}) < 1100', `color("#CC4C02")`],
["${PV_Potential_Yield} < 10615", "color('#006d2c')"], ['Number(${PV_specific_yield}) >= 1100 ', `color("#8C2D04")`],
["true", "color('#00441b', 0.5)"] ["true", "color('#ffffff')"] //no data
] ]
} }
}); });
...@@ -108,7 +145,7 @@ var addBuilding = function () { ...@@ -108,7 +145,7 @@ var addBuilding = function () {
show: true, show: true,
color: { color: {
"conditions" : [ "conditions" : [
["${Electric_Demand} === 0", "color('#ffffff',0)"], ["${Electric_Demand} === 0", "color('#ffffff')"],
["${Electric_Demand} < 3229", "color('#feedde')"], ["${Electric_Demand} < 3229", "color('#feedde')"],
["${Electric_Demand} < 4229", "color('#fdd0a2')"], ["${Electric_Demand} < 4229", "color('#fdd0a2')"],
["${Electric_Demand} < 5229", "color('#fdae6b')"], ["${Electric_Demand} < 5229", "color('#fdae6b')"],
......
public/index.html
+ 8
- 7
View file @ 319c0a8b
...@@ -6,6 +6,8 @@ ...@@ -6,6 +6,8 @@
<title>IQG4iCity</title> <title>IQG4iCity</title>
<!-- <link rel="stylesheet" href="style.css"> --> <!-- <link rel="stylesheet" href="style.css"> -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="shortcut icon" href="favicon.ico" />
</head> </head>
<body> <body>
<div id="topbar" style="display: none;"> <div id="topbar" style="display: none;">
...@@ -20,11 +22,11 @@ ...@@ -20,11 +22,11 @@
</header> </header>
<div class="px-4 pt-5 my-5 text-center border-bottom"> <div class="px-4 pt-5 my-5 text-center border-bottom">
<h1 class="display-4 fw-bold">IQG4iCity</h1> <h1 class="display-4 fw-bold">IQG4iCity</h1>
<h2 class="text-muted">Digitization of heating networks for AI-based operational optimization</h2> <h2 class="text-muted">Digitization of Heating Networks for AI-based Operational Optimization</h2>
<div class="col-lg-6 mx-auto"> <div class="col-lg-6 mx-auto">
<p class="lead mb-4"> <p class="lead mb-4">
<br><br> <br><br>
Digitization of heating networks for AI-based operational optimization - Digitalization can reduce increased heat losses in the networks (inefficient operation, too low spread between supply and return, high power consumption of network pumps). Digitization of heating networks can reduce the increased heat losses in particularly networks causing by inefficient operation, low spread between supply and return, high power consumption of network pumps.
</p> </p>
<div class="d-grid gap-2 d-sm-flex justify-content-sm-center mb-5"> <div class="d-grid gap-2 d-sm-flex justify-content-sm-center mb-5">
<a href="application/index.html" type="button" class="btn btn-outline-secondary btn px-4">To the Application</a> <a href="application/index.html" type="button" class="btn btn-outline-secondary btn px-4">To the Application</a>
...@@ -32,7 +34,7 @@ ...@@ -32,7 +34,7 @@
</div> </div>
<div class="overflow-hidden" style="max-height: 30vh;"> <div class="overflow-hidden" style="max-height: 30vh;">
<div class="container px-5"> <div class="container px-5">
<img src="https://ugl.hft-stuttgart.de/imgs/thumbnails/ensysle.jpg" class="img-fluid border rounded-3 shadow-lg mb-4" alt="Example image" width="700" height="500" loading="lazy"> <img src="application/img/demo.jpg" class="img-fluid border rounded-3 shadow-lg mb-4" alt="Example image" width="700" height="500" loading="lazy">
</div> </div>
</div> </div>
</div> </div>
...@@ -40,20 +42,19 @@ ...@@ -40,20 +42,19 @@
<h3>About Us</h3> <h3>About Us</h3>
Climate change will continue to affect well-being and public health in cities through high pollution and noise emissions. Significant amounts of energy are wasted through building envelopes and heat networks. Facades also contribute to the uncontrolled distribution and absorption of noise emissions. In the context of further digitalization of urban life, new future information networks, and densification of urban areas, additional requirements for cities are emerging. Climate change will continue to affect well-being and public health in cities through high pollution and noise emissions. Significant amounts of energy are wasted through building envelopes and heat networks. Facades also contribute to the uncontrolled distribution and absorption of noise emissions. In the context of further digitalization of urban life, new future information networks, and densification of urban areas, additional requirements for cities are emerging.
<a href="https://www.hft-stuttgart.com/research/projects/current/icity-2-iqg4icity-project">Read more ...</a> <a href="https://www.hft-stuttgart.com/research/projects/current/icity-2-iqg4icity-project">Read more ...</a>
<div class="text-center">
<img src='application/img/iCity_Banner_Logos.webp' alt='Innovative Hochschule' style='height:180px'/>
</div>
</div> </div>
<footer class="footer mt-auto py-3"> <footer class="footer mt-auto py-3">
<div class="container d-flex justify-content-between"> <div class="container d-flex justify-content-between">
<img src='https://transfer.hft-stuttgart.de/img/footer/Innovative_Hochschule_Initiative_BMBF_GWK_RGB.png' alt='Innovative Hochschule' style='height:90px'/>
<div class="mb-3 text-secondary"> <div class="mb-3 text-secondary">
<p class="fs-sm mb-0"><span class="opacity-50 me-1">© All rights reserved. 2022 HFT Stuttgart <br> <p class="fs-sm mb-0"><span class="opacity-50 me-1">© All rights reserved. 2022 HFT Stuttgart <br>
Contact Person: </span><a href="https://www.hft-stuttgart.de/p/thunyathep-santhanavanich" target="_blank">Joe Thunyathep S.</a></p> Contact Person: </span><a href="https://www.hft-stuttgart.de/p/thunyathep-santhanavanich" target="_blank">Joe Thunyathep S.</a></p>
</div> </div>
</div> </div>
</footer> </footer>
<!-- KEINE ÄNDERUNGEN NACH DIESER ZEILE -->
<script src="settings.js"> </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