Skip to content
GitLab
Commit 62fc1f2d authored by patri's avatar patri
Browse files

update Stadentwicklung

parent 8abf49ad
Hide whitespace changes
Inline Side-by-side
Showing
with 293 additions and 1 deletion
+293 -1
vcm/css/sliders.css
+ 60
- 0
View file @ 62fc1f2d
......@@ -42,6 +42,66 @@
background-color: #ad0202;
}
.OneBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #f7fbff;
}
.TwoBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #deebf7;
}
.ThreeBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #c6dbef;
}
.FourBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #9ecae1;
}
.FiveBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #6baed6;
}
.SixBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #4292c6;
}
.SevenBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #2171b5;
}
.EightBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #08519c;
}
.NineBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #08306b;
}
.NoBLD{
border-width: 2px;
border-radius:4px;
border:solid #121212 ;
background-color: #008055;
}
.my-legend .legend-title {
text-align: left;
margin-bottom: 5px;
......
vcm/index.html
+ 49
- 0
View file @ 62fc1f2d
......@@ -359,6 +359,54 @@
Geplanten.</p>
<!-- <p class="contentOne">Vergleich zwischen dem monatlichen Gasamtwärmebedarf der zukünftigen Gebäude und der aktuellen Gebäude.</p> -->
</div>
<button id="men_stadtplanung" onclick="screenspaceErr(true)" type="button"
class="collapsible">Stadtplanung</button>
<div class="content">
<h3>Historische Stadtentwicklung</h3>
<p class="contentOne">Durch dieses Tool kann das Wachstum der Stadt Stuttgart dargestellt werden.</a><br>
</p>
<div onclick='' class='box-3'>
<p>Einfärben &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </p><div class='switch'>
<input type='checkbox' name='toggle' id='chxboxAge' onclick='checkboxAge();'>
<label for='toggle'><i></i></label>
<span></span>
</div></div>
<br>
<div class='addition'>
<div class='legend-title'>Baujahre </div>
<div class='legend-scale addition2'>
<ul class='legend-labels'>
<li class="OneBLD" id="OneBld"><span class="rectangleBld"
style='background:#f7fbff;'></span>min-1900</li>
<li class="TwoBLD" id="TwoBld"><span class="rectangleBld"
style='background:#deebf7;'></span>1900-1915</li>
<li class="ThreeBLD" id="ThreeBld"><span class="rectangleBld"
style='background:#c6dbef;'></span>1915-1930</li>
<li class="FourBLD" id="FourBld"><span class="rectangleBld"
style='background:#9ecae1;'></span>1930-1945</li>
<li class="FiveBLD" id="FiveBld"><span class="rectangleBld"
style='background:#6baed6;'></span>1945-1960</li>
<li class="SixBLD" id="FiveBld"><span class="rectangleBld"
style='background:#4292c6;'></span>1960-1975</li>
<li class="SevenBLD" id="FiveBld"><span class="rectangleBld"
style='background:#2171b5;'></span>1975-1990</li>
<li class="EightBLD" id="FiveBld"><span class="rectangleBld"
style='background:#08519c;'></span>1990-2005</li>
<li class="NineBLD" id="FiveBld"><span class="rectangleBld"
style='background:#08306b;'></span>2005-max</li>
<li class="NoBLD" id="NoBld"><span class="rectangleBld"
style='background:#008055;'></span>No Building Age</li>
</ul>
</div>
<!-- <div class='legend-source'>Source: <a href="#link to source">Name of source</a></div> -->
</div>
<br>
<p>Wachstum kann über einen Slider gezeigt werden: </p><br>
<div id = "slider-step"></div><br>
<div id="slider-step-value"></div><br>
</div>
<button id="men_acoustic" onclick="akkustikview()" type="button" class="collapsible">Akustik</button>
<div class="content">
......@@ -1403,6 +1451,7 @@
<script src="js/favoriteplaces.js"></script>
<script src="js/codepoly.js"></script>
<script src="js/custom.js"></script>
<script src="js/cityplanning.js"></script>
<script src="js/newDevBahn.js"></script>
<script src="js/cus_Menu.js"></script>
<script src="js/cus_SimStadt.js"></script>
......
vcm/js/cityplanning.js 0 → 100644
+ 183
- 0
View file @ 62fc1f2d
function checkboxAge() {
var chk_ceil = document.getElementById("chxboxAge");
if (chk_ceil.checked == true) {
screenspaceErr(true)
BuildingAGE();
} else {
removebuildings();
}
};
function BuildingAGE() {
screenspaceErr(true)
var Framework = vcs.vcm.Framework.getInstance();
var layers = Framework.getLayers();
var layerIndexRosenstein
var layernameRosenstein = ["StuttgartLocal"]
var frameworkZus = vcs.vcm.Framework.getInstance();
var layersZus = frameworkZus.getLayers();
for (var i = 0; i < layersZus.length; i++) {
var layerst = layersZus[i];
if (layernameRosenstein.indexOf(layerst.name) >= 0) {
layerIndexRosenstein = i
}
}
layer2 = layers[layerIndexRosenstein];
var tileset = layer2.cesium3DTileset;
if (tileset) {
tileset.style = new Cesium.Cesium3DTileStyle({
color: {
conditions: [
["Number(${citygml_year_of_construction}) < 1900", "color('#f7fbff')"],
["Number(${citygml_year_of_construction}) <= 1915", "color('#deebf7')"],
["Number(${citygml_year_of_construction}) <= 1930", "color('#c6dbef')"],
["Number(${citygml_year_of_construction}) <= 1945", "color('#9ecae1')"],
["Number(${citygml_year_of_construction}) <= 1960", "color('#6baed6')"],
["Number(${citygml_year_of_construction}) <= 1975", "color('#4292c6')"],
["Number(${citygml_year_of_construction}) <= 1990", "color('#2171b5')"],
["Number(${citygml_year_of_construction}) <= 2005", "color('#08519c')"],
["Number(${citygml_year_of_construction}) <= 2020", "color('#08306b')"],
["true", "color('#008055')"]
],
},
});
}
var layerIndexPart
var layernamePart = ["StuttgartPart"]
var frameworkPart = vcs.vcm.Framework.getInstance();
var layersPart = frameworkPart.getLayers();
for (var i = 0; i < layersPart.length; i++) {
var layerPart = layersPart[i];
if (layernamePart.indexOf(layerPart.name) >= 0) {
layerPart.activate(false);
}
}
// layer3 = layersPart[layerIndexPart];
// var tilesetPart = layer3.cesium3DTileset;
// if (tilesetPart) {
// tilesetPart.style = new Cesium.Cesium3DTileStyle({
// color: {
// conditions: [
// ["${citygml_year_of_construction} === 'DEBW522AA0001fd8a'", "color('#000000FF')"],
// ["${gml_id} === 'DEBW522AA00016448'", "color('#000000FF')"],
// ["true", "color('#000000FF')"],
// ],
// },
// });
// }
// ----------why does this not work?
// for (i = 0; i < id.length - 1; i++){
// idtext = '' + id[i]
// layer.highlight({idtext:Cesium.Color.fromCssColorString("#BB8FCE")})
// console.log("layer.highlight({" + idtext + ":Cesium.Color.fromCssColorString('#BB8FCE')})")
// }
}
var stepSlider = document.getElementById('slider-step');
noUiSlider.create(stepSlider, {
start: [1900],
step: 1,
range: {
'min': [1900],
'max': [2020]
}
});
var stepSliderValueElement = document.getElementById('slider-step-value');
stepSlider.noUiSlider.on('update', function (values, handle) {
stepSliderValueElement.innerHTML = "Gebäude gebaut vor: " + parseInt(values[handle]);
BuildingAGEdynamic(parseFloat(values[handle]))
});
function BuildingAGEdynamic(age) {
screenspaceErr(true)
var Framework = vcs.vcm.Framework.getInstance();
var layers = Framework.getLayers();
var layerIndexRosenstein
var layernameRosenstein = ["StuttgartLocal"]
var frameworkZus = vcs.vcm.Framework.getInstance();
var layersZus = frameworkZus.getLayers();
for (var i = 0; i < layersZus.length; i++) {
var layerst = layersZus[i];
if (layernameRosenstein.indexOf(layerst.name) >= 0) {
layerIndexRosenstein = i
}
}
layer2 = layers[layerIndexRosenstein];
var tileset = layer2.cesium3DTileset;
if (tileset) {
tileset.style = new Cesium.Cesium3DTileStyle({
color: {
conditions: [
["Number(${citygml_year_of_construction}) <= "+ age + "", "color('#292a2e')"],
["true", "color('#B7D9B1','0')"]
],
},
});
}
var layerIndexPart
var layernamePart = ["StuttgartPart"]
var frameworkPart = vcs.vcm.Framework.getInstance();
var layersPart = frameworkPart.getLayers();
for (var i = 0; i < layersPart.length; i++) {
var layerPart = layersPart[i];
if (layernamePart.indexOf(layerPart.name) >= 0) {
layerPart.activate(false);
}
}}
function screenspaceErr(tf) {
var Framework = vcs.vcm.Framework.getInstance();
var layers = Framework.getLayers();
var layerIndexRosenstein
var layernameRosenstein = ["StuttgartLocal"]
var frameworkZus = vcs.vcm.Framework.getInstance();
var layersZus = frameworkZus.getLayers();
for (var i = 0; i < layersZus.length; i++) {
var layerst = layersZus[i];
if (layernameRosenstein.indexOf(layerst.name) >= 0) {
layerIndexRosenstein = i
}
}
layer2 = layers[layerIndexRosenstein];
if(tf == true){
layer2.screenSpaceErrorMobile = 1
layer2.screenSpaceError = 1
} else {
layer2.screenSpaceErrorMobile = 32
layer2.screenSpaceError = 16
}
}
\ No newline at end of file
vcm/js/newDevBahn.js
+ 1
- 1
View file @ 62fc1f2d
......@@ -4,7 +4,7 @@ var heatdemVal03 = 300
var heatdemVal04 = 400
function removebuildings() {
screenspaceErr(false)
var layerIndexStuttgartTotal
var layerIndexStuttgartBahnhof
var layernameStuttgartTotal = ["StuttgartLocal"]
......
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