var chartButton = document.getElementById('chartButton'); var heatingdemand = document.getElementById('filterswitch2'); var radio = document.getElementById('radio-group'); var filterswitches = document.getElementById('filterswitches'); //Show / hide chart chartButton.addEventListener('click', function() { //sets as default attribute building function myChartArea("bar", "Building Function", 1, "Building Type", "Frequency", coloR); addGlobalData(areaChart, buildingType, btFrequency, btFrequency.length) if (drawBox === false) { swal("CAN'T LOAD DATA!", "mark an area first!", "error"); } else { var x = document.getElementById('areaChartContainer'); if (x.style.visibility === 'visible') { //button.firstChild.data = "Show chart"; x.style.visibility = 'hidden'; } else { //button.firstChild.data = "Hide chart"; x.style.visibility = 'visible'; } } }, false); heatingdemand.addEventListener('click', function() { var x = document.getElementById('heat-demand-legend'); if (!document.getElementById('checkbox2').checked) { x.style.visibility = 'hidden'; } else { x.style.visibility = 'visible'; } }, false); radio.addEventListener('click', function() { if (document.getElementById("surface").checked) { document.getElementById("checkbox1").disabled = false; document.getElementById("checkbox2").disabled = true; if (document.getElementById("checkbox2").checked) { document.getElementById("checkbox2").checked = false; document.getElementById('heat-demand-legend').style.visibility = 'hidden'; tileContent.forEach(t => t.color = new Cesium.Color(1, 1, 1, 1)) } } else { document.getElementById("checkbox1").disabled = true; document.getElementById("checkbox2").disabled = false; if (document.getElementById("checkbox1").checked) { document.getElementById("checkbox1").checked = false; tileContent.forEach(t => t.color = new Cesium.Color(1, 1, 1, 1)) } } }, false); filterswitches.addEventListener('click', function() { if (drawBox === false) { swal("CAN'T LOAD DATA!", "mark an area first!", "error"); document.getElementById("checkbox2").disabled = true; document.getElementById("checkbox1").disabled = true; } else { if (document.getElementById("surface").checked) { document.getElementById("checkbox1").disabled = false; document.getElementById("checkbox2").disabled = true; } else { document.getElementById("checkbox1").disabled = true; document.getElementById("checkbox2").disabled = false; } } }, false); function toggleSidebar(ref) { document.getElementById("sidebar").classList.toggle('active'); } //loop through all dropdown buttons to toggle between hiding and showing its dropdown content var dropdown = document.getElementsByClassName("dropdown-btn"); var i; for (i = 0; i < dropdown.length; i++) { dropdown[i].addEventListener("click", function() { this.classList.toggle("active"); var dropdownContent = this.nextElementSibling; if (dropdownContent.style.display === "block") { dropdownContent.style.display = "none"; } else { dropdownContent.style.display = "block"; } }); }