cus_Menu.js

var acc = document.getElementsByClassName("accordion");
            var i; 
            for (i = 0; i < acc.length; i++) {
              acc[i].addEventListener("click", function() {
                this.classList.toggle("active");
                
                var subMenu = this.nextElementSibling;
                if (subMenu.style.maxHeight) {
                    subMenu.style.maxHeight = null;
                    position_var = false;
                    pointsoe = " "
                } else {
                    subMenu.style.maxHeight = subMenu.scrollHeight + "px";
                } 
              });
            }

async function nordbahnview(){
  var viewp = vcs.vcm.Framework.getInstance().viewpoints.NordBView
  vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(viewp);

  // document.getElementById("UmfrageOne").style.display = "none";
  // document.getElementById("NordbahnhofInfo").style.display = "block";
  // document.getElementById("Navigation").style.display = "none";
  // document.getElementById("projektOne").style.display = "none";
  // document.getElementById("Energiekonzept").style.display = "none";
  // document.getElementById("IntroProj").style.display = "none";
  // document.getElementById("Expertenmodus").style.display = "block";

  await new Promise(resolve => setTimeout(resolve, 100));
  showgraph();
  
}
function akkustikview(){
  var viewp = vcs.vcm.Framework.getInstance().viewpoints.NoiseView
  vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(viewp);
}
function MobilityView(){
  var viewp = vcs.vcm.Framework.getInstance().viewpoints.MobilityView
  vcs.vcm.Framework.getInstance().getActiveMap().gotoViewPoint(viewp);
}

var expstate = false;
function onoff(){

  if(expstate == false){
    // var element = document.getElementById("menustuff");
    // element.classList.remove("hidden");
    expstate = true;
  }else{
    // var element = document.getElementById("menustuff");
    // element.classList.add("hidden");
    expstate = false;
  }
}

function addcont(content){
    var bilderstuff =                     '<div class="slideshow-container">' +
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">1 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/grafik_aufgabenstellung.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Grafik</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">2 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/boeckinger_strasse.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Böckinger Straße</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">3 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/holzwerkstatt_igh.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Holzwerkstatt</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">4 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/infoabend_garten_igh.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Infoabend im Garten</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">5 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/interviews_nachbarschaft.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Interviews in der Nachbarschaft</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">6 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/offene_bauwerkstatt_1.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Offene Bauwerkstatt</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">7 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/offene_bauwerkstatt_2.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Offene Bauwerkstatt</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">8 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/offene_bauwerkstatt_3.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Offene Bauwerkstatt</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">9 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/planungsgebiet_choreographie.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Planungsgebiet Choreographie</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">10 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/planungsgebiet_vogelperspektive.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Planungsgebiet Vogelperspektive</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">11 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/station1_spielekiosk.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Spielekiosk</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">12 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/station2_gartenkiosk.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Gartenkiosk</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">13 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/station3_outdoorkiosk.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Outdoorkiosk</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">14 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/station3_outdoorkiosk1.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Outdoorkiosk</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">15 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/station4_infokiosk.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Infokiosk</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">16 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/workshop_cafe_tas_1.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Workshop Cafe Tas</div>'+
        '</div>'+
        '<div class="mySlides1 fade">'+
        '<div class="numbertext">17 / 17</div>'+
        '<img src="images/content/contentboeckingerstrasse/workshop_cafe_tas_2.jpg" style="width:100%;border-radius: 10px;border: 1px solid black;">'+
        '<div class="text">Workshop Cafe Tas</div>'+
        '</div>'+
        '<!-- Next and previous buttons -->'+
        '<a class="prev" onclick="plusSlides(-1, 0)">&#10094;</a>'+
        '<a class="next" onclick="plusSlides(1, 0)">&#10095;</a>'+
        '</div>'+
        '<br>'

    var heatdem = '<div style="width:100%;min-height: 0px !important;" id="chartNordB"></div>'

    var nordbstuff =            "" +
    "<div class='box-3'>"+
        "<div class='btn btn-three' onclick='newPlan()'>"+
        "<span>Neue Planung</span>"+
        "</div><br>"+
        "<div class='btn btn-three' onclick='oldZust()'>"+
        "<span>Ist Zustand</span>"+
        "</div><br></div>"+
        "<div onclick='document.getElementById('chxboxHighlight').click()' class='box-3'>"+
        "<p>Highlight &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </p><div class='switch'>"+
        "<input type='checkbox' name='toggle' id='chxboxHighlight' onclick='checkboxHighlight(true);'>"+
        "<label for='toggle'><i></i></label>"+
        "<span></span>"+
        "</div>"+
        "</div>"+
        "<div onclick='document.getElementById('chxboxDemand').click()' class='box-3'>"+
        "<p>Wärmebedarf           &nbsp;</p><div class='switch'>"+
        "<input type='checkbox' name='toggle' id='chxboxDemand' onclick='checkboxDemand(true);'>"+
        "<label for='toggle'><i></i></label>"+
        "<span></span>"+
    "</div>"+
        "</div>"
        var nordbstuff2 =            "" +
        "<div class='box-3'>"+
            "<div class='btn btn-three' onclick='newPlan()'>"+
            "<span>Neue Planung</span>"+
            "</div><br>"+
            "<div class='btn btn-three' onclick='oldZust()'>"+
            "<span>Ist Zustand</span>"+
            "</div><br></div>"
        heatdemVal01 = 100
        heatdemVal02 = 200
        heatdemVal03 = 300
        heatdemVal04 = 400



  if (content == "main_bock"){
    var bilder = document.getElementById('bilder_bock') 
    var other = document.getElementById('bilder_bock2')
    other.innerHTML = ""
    bilder.innerHTML = ""
    // bilder.innerHTML = bilderstuff
    // showSlides(1, 0);
    // showSlides(1, 1);
  } else if (content == "main_bock2"){
    var bilder = document.getElementById('bilder_bock2') 
    var other = document.getElementById('bilder_bock')
    other.innerHTML = ""
    bilder.innerHTML = ""
    bilder.innerHTML = bilderstuff
    showSlides(1, 0);
    showSlides(1, 1);
  } else if (content == "main_heatdem"){
    var heatdemand = document.getElementById('main_heatdem') 
    // var other = document.getElementById('main_heatdem2')
    // other.innerHTML = ""
    heatdemand.innerHTML = ""
    heatdemand.innerHTML = heatdem

  } else if (content == "main_heatdem2"){
    var heatdemand = document.getElementById('main_heatdem2') 
    var other = document.getElementById('main_heatdem')
    other.innerHTML = ""
    heatdemand.innerHTML = ""
    heatdemand.innerHTML = heatdem

  } else if (content == "main_nordbstuff"){
    var nordb = document.getElementById('nordbplanung') 
    var other = document.getElementById('nordbplanung2')
    var other2 = document.getElementById('nordbplanung3')
    other.innerHTML = ""
    nordb.innerHTML = ""
    other2.innerHTML = ""
    nordb.innerHTML = nordbstuff
  } else if (content == "main_nordbstuff2"){
    var nordb = document.getElementById('nordbplanung2') 
    var other2 = document.getElementById('nordbplanung3')
    var other = document.getElementById('nordbplanung')
    other.innerHTML = ""
    nordb.innerHTML = ""
    other2.innerHTML = ""
    nordb.innerHTML = nordbstuff2
  }else if (content == "main_nordbstuff3"){
    var other2 = document.getElementById('nordbplanung2') 
    var nordb = document.getElementById('nordbplanung3')
    var other = document.getElementById('nordbplanung')
    other.innerHTML = ""
    other2.innerHTML = ""
    nordb.innerHTML = ""
    nordb.innerHTML = nordbstuff
  }

 
    

    



// Thumbnail image controls
// function currentSlide(n) {
//   showSlides(slideIndex = n);
// }


};

var slideIndex = [1,1];

var slideId = ["mySlides1", "mySlides2"]
// Next/previous controls
  function plusSlides(n, no) {
      showSlides(slideIndex[no] += n, no);
  }  
  
  
function showSlides(n, no) {
  var i;
  var x = document.getElementsByClassName(slideId[no]);
  if (n > x.length) {slideIndex[no] = 1}
  if (n < 1) {slideIndex[no] = x.length}
  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";
  }
  x[slideIndex[no]-1].style.display = "block";
}
function currentSlide(n) {
  showSlides(n, 0);
}



var slideIndexNord = 1;
showSlidesNord(slideIndexNord);

// Next/previous controls
function plusSlidesNord(n) {
  showSlidesNord(slideIndexNord += n);
}

// Thumbnail image controls
function currentSlideNord(n) {
  showSlidesNord(slideIndexNord = n);
}

function showSlidesNord(n) {
  var i;
  var slides = document.getElementsByClassName("mySlidesNord");
  var dots = document.getElementsByClassName("dotNord");
  if (n > slides.length) {slideIndexNord = 1}
  if (n < 1) {slideIndexNord = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none";
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" activeNord", "");
  }
  slides[slideIndexNord-1].style.display = "block";
  dots[slideIndexNord-1].className += " activeNord";
}




var slideIndexRosen = 1;
showSlidesRosen(slideIndexRosen);

// Next/previous controls
function plusSlidesRosen(n) {
  showSlidesRosen(slideIndexRosen += n);
}

// Thumbnail image controls
function currentSlideRosen(n) {
  showSlidesRosen(slideIndexRosen = n);
}

function showSlidesRosen(n) {
  var i;
  var slides = document.getElementsByClassName("mySlidesRosen");
  var dots = document.getElementsByClassName("dotRosen");
  if (n > slides.length) {slideIndexRosen = 1}
  if (n < 1) {slideIndexRosen = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none";
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" activeRosen", "");
  }
  slides[slideIndexRosen-1].style.display = "block";
  // dots[slideIndexRosen-1].className += " activeRosen";
}