An error occurred while loading the file. Please try again.
-
Rosanny Sihombing authoredcea2f272
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Use correct character set. -->
<meta charset="utf-8">
<!-- Tell IE to use the latest, best version. -->
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<!-- Make the app on mobile take up the full browser screen and disable user scaling. -->
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>Gerlingen 3D Viewer</title>
<!-- The Cesium library. -->
<script src="https://cesium.com/downloads/cesiumjs/releases/1.81/Build/Cesium/Cesium.js"></script>
<link href="https://cesium.com/downloads/cesiumjs/releases/1.81/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
<!-- stylesheets -->
<link rel="stylesheet" href="index.css" media="screen">
<link rel="stylesheet" type="text/css" href="./CSS/Gerlingen.css">
</head>
<body>
<!-- defining container to keep cesium viewer -->
<div id="cesiumContainer"></div>
<!-- defining menu panel -->
<div class="backdrop" id="menu">
<h2>Gerlingen 3D Viewer</h2>
<span><strong>Show</strong></span>
<div class="nowrap">
<input id="3dbuildings" name="source" type="radio" checked/>
<label for="3dbuildings">3D Buildings</label>
</div>
<div class="nowrap">
<input id="heatdemand" name="source" type="radio"/>
<label for="heatdemand">Avg. Sp. Heating Demand</label>
</div>
<div class="nowrap">
<input id="pvpotential" name="source" type="radio"/>
<label for="pvpotential">Avg. Photovoltaic Potenial</label>
</div>
<br>
<!-- for legend panel -->
<div id=heatdemandlegend>
<hr color='white'>
<div class='my-legend' id="legendcontainer">
<div class='legend-title'>Avg. Sp. Heating Demand (kWh/(m².a))</div>
<div class='legend-scale'>
<ul class='legend-labels'>
<li><span style='background:#61B949;'></span>Less than 25</li>
<li><span style='background:#A4C711;'></span>25 to 50</li>
<li><span style='background:#B2D531;'></span>50 to 75</li>
<li><span style='background:#D1E023;'></span>75 to 100</li>
<li><span style='background:#F6EC00;'></span>100 to 125</li>
<li><span style='background:#FECE02;'></span>125 to 150</li>
<li><span style='background:#F9A717;'></span>150 to 200</li>
<li><span style='background:#F56D1F;'></span>200 to 250</li>
<li><span style='background:#F22E22;'></span>More than 250</li>
<li><span style='background:#FFFFFF;'></span>None Heated / No Data</li>
</ul>
</div>
</div>
</div>
<div id=pvpotentialLegend>
<hr color='white'>
<div class='my-legend' id="legendcontainer">
<div class='legend-title'>Avg. Photovoltaic Potenial (MWh/a)</div>
<div class='legend-scale'>
<ul class='legend-labels'>
<li><span style='background:#fc4f00;'></span>Less than 5</li>
<li><span style='background:#f27600;'></span>5 to 10</li>
<li><span style='background:#e29700;'></span>10 to 15</li>
<li><span style='background:#cab500;'></span>15 to 20</li>
<li><span style='background:#aad000;'></span>20 to 25</li>
<li><span style='background:#7de800;'></span>25 to 30</li>
<li><span style='background:#00ff00;'></span>More than 30</li>
<li><span style='background:#ffffff;'></span>No Data</li>
</ul>
</div>
</div>
</div>
</div>
<a href="https://www.hft-stuttgart.de/" target='_blank'>
<div class="credit"></div>
</a>
<!-- javascript -->
<script src="./Source/App.js"></script>
</body>
</html>