newDevBahn.js

var heatdemVal01 = 100
var heatdemVal02 = 200
var heatdemVal03 = 300
var heatdemVal04 = 400

function removebuildings() {
  var layerIndexStuttgartTotal
  var layerIndexStuttgartBahnhof
  var layernameStuttgartTotal = ["StuttgartLocal"]
  var layernameStuttgartBahnhof = ["StuttgartPart"]
  var frameworkSTU = vcs.vcm.Framework.getInstance();
  var layersSTU = frameworkSTU.getLayers();
  for (var i = 0; i< layersSTU.length; i++) {
    var layerst = layersSTU[i];
    if(layernameStuttgartTotal.indexOf(layerst.name) >= 0) {
      layerIndexStuttgartTotal = i
  }}
  for (var i = 0; i< layersSTU.length; i++) {
    var layerst = layersSTU[i];
    if(layernameStuttgartBahnhof.indexOf(layerst.name) >= 0) {
      layerIndexStuttgartBahnhof = i
  }}


  var layerBAHN = layersSTU[layerIndexStuttgartBahnhof];
  var layerSTU = layersSTU[layerIndexStuttgartTotal];
  var tilesetSTU = layerSTU.cesium3DTileset;
  var tilesetBAHN = layerBAHN.cesium3DTileset;
  if( tilesetSTU ) {
    tilesetSTU.style = new Cesium.Cesium3DTileStyle({
      color: {
        conditions: [
          ["regExp('DEBW522AA0000ee8d').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0000c4d8').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0000c4d6').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0000c4d7').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0002bef8').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0003afbd').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0004327e').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA000345f7').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0000d2c3').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00001bf2').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00013824').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00013825').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00001bf3').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0001fc97').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00037c31').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0002bef9').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00014e93').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00042cff').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00033a36').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00033d46').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00038caf').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA000183c1').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00006db1').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0002bab2').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00021f4a').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0001f8b2').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00013b9e').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0001f8b2').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00022dcd').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00041629').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00038b0e').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0003bf3c').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00022bdd').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00001d01').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0000976b').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0001374b').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0001fc98').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0000c4d4').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0000c4d5').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00026ca1').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00023f8f').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA000014c4').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA000426e5').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0001566f').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0000db38').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA0000ef56').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00027ddb').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA000039fd').test(${gml_id})","color('#38943d','0')"],
          // ["(${gml_id} === 'DEBW522AA0000ee8d')", "color('#38943d','0.5')"],
          // ["(${gml_parent_id} === 'DEBW522AA0000ee8c')", "color('#38943d','0.5')"],
          ["true", "color('#FFFFFF')"],
        ],
      },
    });

  }
  if( tilesetBAHN ) {
    tilesetBAHN.style = new Cesium.Cesium3DTileStyle({
      color: {
        conditions: [
          ["regExp('DEBW522AA0001fd8a').test(${gml_id})","color('#38943d','0')"],
          ["regExp('DEBW522AA00016448').test(${gml_id})","color('#38943d','0')"],
          ["true", "color('#FFFFFF')"],
        ],
      },
    });

}



};



function oldZust(){

    var layerNamesToDeactivate = ["Rosenstein"]
    var layers = framework.getLayers();

    for (var i = 0; i< layers.length; i++) {
    var layer = layers[i];
    if(layerNamesToDeactivate.indexOf(layer.name) >= 0) {
    layer.activate(false);
  }}

    var layerNamesToActivate = ["StuttgartPart"]
    var layersA = framework.getLayers();

    for (var i = 0; i< layersA.length; i++) {
    var layerA = layersA[i];
    if(layerNamesToActivate.indexOf(layerA.name) >= 0) {
    layerA.activate(true);
    }}


    checkboxHighlight(false);
    checkboxDemand(false);
    
    
  // var layerIndexStockach
  // var layernameStockach = ["Stöckach"]
  // var frameworkZus = vcs.vcm.Framework.getInstance();
  // var layersZus = frameworkZus.getLayers();
  // for (var i = 0; i< layersZus.length; i++) {
  //   var layerst = layersZus[i];
  //   if(layernameStockach.indexOf(layerst.name) >= 0) {
  //   layerIndexStockach = i
  // }}
  // var layerStock = layersZus[layerIndexStockach];

  // layerStock.showObjects(["DEBW522AA00022dcc", "DEBW522AA0003bf3b","DEBW522AA0000976a","DEBW522AA00001d00"]);


  }

  function newPlan(){

    var layerNamesToActivate = ["Rosenstein"]
    var layers = framework.getLayers();

    for (var i = 0; i< layers.length; i++) {
    var layer = layers[i];
    if(layerNamesToActivate.indexOf(layer.name) >= 0) {
    layer.activate(true);
  }}
    var layerNamesToDeactivate = ["StuttgartPart"]
    var layersA = framework.getLayers();

    for (var i = 0; i< layersA.length; i++) {
    var layerA = layersA[i];
    if(layerNamesToDeactivate.indexOf(layerA.name) >= 0) {
    layerA.activate(false);
    }}

    
    checkboxHighlight(false);
    checkboxDemand(false);

  // var layerIndexStockach
  // var layernameStockach = ["Stöckach"]
  // var frameworkZus = vcs.vcm.Framework.getInstance();
  // var layersZus = frameworkZus.getLayers();
  // for (var i = 0; i< layersZus.length; i++) {
  //   var layerst = layersZus[i];
  //   if(layernameStockach.indexOf(layerst.name) >= 0) {
  //   layerIndexStockach = i
  // }}
  // var layerStock = layersZus[layerIndexStockach];

  // layerStock.hideObjects(["DEBW522AA00022dcc", "DEBW522AA0003bf3b","DEBW522AA0000976a","DEBW522AA00001d00"]);

  }

  function checkboxHighlight(change){
    var chk_ceil= document.getElementById("chxboxHighlight");
    if(chk_ceil.checked == true){
      if(change==true){
        document.getElementById("chxboxDemand").checked = false;
      }
      highlightStuff();
    } else {
      if( document.getElementById("chxboxDemand").checked==false){
        unhighlightStuff();
      }
      // if(change==true){
      //   document.getElementById("chxboxDemand").checked = false;
      // }
      
    }

  };



  function checkboxDemand(change){
    var chk_ceil= document.getElementById("chxboxDemand");
    if(chk_ceil.checked == true){
      if(change==true){
        document.getElementById("chxboxHighlight").checked = false;
      }
      highlightEnergy();
    } else {
      if(document.getElementById("chxboxHighlight").checked == false){
        unhighlightStuff();
      }
      // if(change==true){
      //   document.getElementById("chxboxHighlight").checked = false;
      // }
      
    }
  };

  function highlightStuff() {
    var layerIndexStockach
    var layernameStockach = ["Stöckach"]
    var frameworkZus = vcs.vcm.Framework.getInstance();
    var layersZus = frameworkZus.getLayers();
    for (var i = 0; i< layersZus.length; i++) {
      var layerst = layersZus[i];
      if(layernameStockach.indexOf(layerst.name) >= 0) {
      layerIndexStockach = i
    }}
    highlightBuildings(layerIndexStockach,["DEBW522AA00022dcc", "DEBW522AA0003bf3b","DEBW522AA0000976a","DEBW522AA00001d00"]);

    var layerNamesToActivate = ["C1"]
    var layerNamesToActivate2 = ["B"]
    var layers = framework.getLayers();

    for (var i = 0; i< layers.length; i++) {
    var layer = layers[i];
    if(layerNamesToActivate.indexOf(layer.name) >= 0) {
    layer.activate(true);
    }
    if(layerNamesToActivate2.indexOf(layer.name) >= 0) {
      layer.activate(true);
    }
  }
}

  function highlightBuildings(layerIndex, id){

    var Framework = vcs.vcm.Framework.getInstance();
    var layers = Framework.getLayers();
    var layer = layers[layerIndex];
    layer.highlight({"DEBW522AA00022dcc":Cesium.Color.fromCssColorString("#BB8FCE")})
    layer.highlight({"DEBW522AA0003bf3b":Cesium.Color.fromCssColorString("#BB8FCE")})
    layer.highlight({"DEBW522AA0000976a":Cesium.Color.fromCssColorString("#BB8FCE")})
    layer.highlight({"DEBW522AA00001d00":Cesium.Color.fromCssColorString("#BB8FCE")})

    var layerIndexRosenstein
    var layernameRosenstein = ["Rosenstein"]
    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: [
              ["true", "color('#77a1b9')"],
          ],
        },
      });

    }


    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) {
      layerIndexPart = i
    }}

    layer3 = layersPart[layerIndexPart];
    var tilesetPart = layer3.cesium3DTileset;
    if (tilesetPart) {
      tilesetPart.style = new Cesium.Cesium3DTileStyle({
          color: {
            conditions: [
                ["${gml_id} === 'DEBW522AA0001fd8a'", "color('#FFFFFF')"],
                ["${gml_id} === 'DEBW522AA00016448'", "color('#FFFFFF')"],
                ["true", "color('#77a1b9')"],
            ],
          },
        });
    }

    // ----------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')})")
    // }

  }

  function unhighlightStuff() {

    // var layerIndexStockach
    // var layernameStockach = ["Stöckach"]
     var framework = vcs.vcm.Framework.getInstance();
     var layers = framework.getLayers();
    // for (var i = 0; i< layers.length; i++) {
    //   var layersto = layers[i];
    //   if(layernameStockach.indexOf(layersto.name) >= 0) {
    //   layerIndexStockach = i
    // }}
    // var layer = layers[layerIndexStockach];
    // layer.highlight({"DEBW522AA00022dcc":Cesium.Color.fromCssColorString("#BB8FCE")})
    // layer.highlight({"DEBW522AA0003bf3b":Cesium.Color.fromCssColorString("#BB8FCE")})
    // layer.highlight({"DEBW522AA0000976a":Cesium.Color.fromCssColorString("#BB8FCE")})
    // layer.highlight({"DEBW522AA00001d00":Cesium.Color.fromCssColorString("#BB8FCE")})
    // layer.clearHighlighting();




    var layerIndexRosenstein
    var layernameRosenstein = ["Rosenstein"]
    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;
    layer2.clearStyle();

    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) {
      layerIndexPart = i
    }}


    layer3 = layersPart[layerIndexPart];
    // var tilesetPart = layer3.cesium3DTileset;
    layer3.clearStyle();
    // tileset.style = new Cesium.Cesium3DTileStyle({
    //   color: {
    //     conditions: [
    //         ["true", "rgb(127, 59, 8)"],
    //     ],
    //   },
    // });

    var layerNamesToActivate = ["C1"]
    var layerNamesToActivate2 = ["B"]
    var layerss = framework.getLayers();

    for (var i = 0; i< layerss.length; i++) {
    var layero = layerss[i];
    if(layerNamesToActivate.indexOf(layero.name) >= 0) {
    layero.activate(false);
    }
    if(layerNamesToActivate2.indexOf(layero.name) >= 0) {
      layero.activate(false);
    }
  }
  }






  function highlightEnergy() {


    var layerIndexRosenstein
    var layernameRosenstein = ["Rosenstein"]
    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
    }}


    var layer2 = layersZus[layerIndexRosenstein];
    var tileset = layer2.cesium3DTileset;
    if( tileset ) {
      tileset.style = new Cesium.Cesium3DTileStyle({
        color: {
          conditions: [
            ["(${Specificspaceheatingdemand} > 0)  && (${Specificspaceheatingdemand} < " + heatdemVal01 + ")", "color('#38943d')"],
            ["(${Specificspaceheatingdemand} >= " + heatdemVal01 + ")  && (${Specificspaceheatingdemand} < " + heatdemVal02 + ")", "color('#699438')"],
            ["(${Specificspaceheatingdemand} >= " + heatdemVal02 + ")  && (${Specificspaceheatingdemand} < " + heatdemVal03 + ")", "color('#d0d40b')"],
            ["(${Specificspaceheatingdemand} >= " + heatdemVal03 + ")  && (${Specificspaceheatingdemand} < " + heatdemVal04 + ")", "color('#db6f09')"],
            ["(${Specificspaceheatingdemand} >= " + heatdemVal04 + ")  && (${Specificspaceheatingdemand} < 500)", "color('#ad0202')"],
            ["true", "color('#77a1b9')"],
          ],
        },
      });

    }


    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) {
      layerIndexPart = i
    }}

    var layer3 = layersPart[layerIndexPart];
    var tilesetPart = layer3.cesium3DTileset;
    if (tilesetPart) {
      tilesetPart.style = new Cesium.Cesium3DTileStyle({
          color: {
            conditions: [
                ["${gml_id} === 'DEBW522AA0001fd8a'", "color('#FFFFFF')"],
                ["${gml_id} === 'DEBW522AA00016448'", "color('#FFFFFF')"],
                ["(${Specificspaceheatingdemand} > 0)  && (${Specificspaceheatingdemand} < " + heatdemVal01 + ")", "color('#38943d')"],
                ["(${Specificspaceheatingdemand} >= " + heatdemVal01 + ")  && (${Specificspaceheatingdemand} < " + heatdemVal02 + ")", "color('#699438')"],
                ["(${Specificspaceheatingdemand} >= " + heatdemVal02 + ")  && (${Specificspaceheatingdemand} < " + heatdemVal03 + ")", "color('#d0d40b')"],
                ["(${Specificspaceheatingdemand} >= " + heatdemVal03 + ")  && (${Specificspaceheatingdemand} < " + heatdemVal04 + ")", "color('#db6f09')"],
                ["(${Specificspaceheatingdemand} >= " + heatdemVal04 + ")  && (${Specificspaceheatingdemand} < 500)", "color('#ad0202')"],
                ["true", "color('#77a1b9')"],
            ],
          },
        });
    }

    // ----------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')})")
    // }

  }

  function showgraph(){
    var options = {
    series: [{
      name: "Bisheriges Gebäude",
      data: [376513, 291342, 187649, 62589, 3942,0,0,0, 8, 81966, 231772, 360644]
  },{
    name:"Neues Gebäude",
    data: [37772, 28936, 17886, 4169, 128,1,0,0, 44, 7224, 23163, 36245]
  }],
    chart: {
    height: 350,
    width: '100%',
    type: 'line',
    zoom: {
      enabled: false
    }
  },
  dataLabels: {
    enabled: false
  },
  stroke: {
    curve: 'straight'
  },
  title: {
    text: 'Heating Demand by Month',
    align: 'left'
  },
  grid: {
    row: {
      colors: ['#f3f3f3', 'transparent'], // takes an array which will be repeated on columns
      opacity: 0.5
    },
  },
  xaxis: {
    categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep','Okt','Nov','Dez'],
  }
  };

  var chart = new ApexCharts(document.querySelector("#chartNordB"), options);
  chart.render();

  }