diff --git a/index.js b/index.js index d962362..3b25c79 100644 --- a/index.js +++ b/index.js @@ -53,6 +53,7 @@ resizeObserver.observe(map_container); const map_navigator = document.getElementById('mapNavigator'); const zoomLevelDisplay = document.getElementById('zoomLevelDisplay'); +const zoomStyle = document.getElementById('zoomStyle'); const styleRoot = document.querySelector(':root'); const svgns = map.getAttribute('xmlns'); @@ -86,12 +87,6 @@ let previousMapScale = -1; let MapMatrix = {}; document.addEventListener('DOMContentLoaded', async () => { - let dynamicStyles = []; - for(let i=0; i= scaleCullThresholds[i].scale ? 'initial' : 'none'); - styleRoot.style.setProperty(`--maxZoomCull_state_${i}`, mapNav.scale <= scaleCullThresholds[i].scale ? 'initial' : 'none'); + if(mapNav.scale >= scaleCullThresholds[i].scale) dynamicStyles.push(`.maxZoomCull_${i}{display:none;}`); + if(mapNav.scale <= scaleCullThresholds[i].scale) dynamicStyles.push(`.minZoomCull_${i}{display:none;}`); } + zoomStyle.innerHTML = dynamicStyles.join('\n'); } previousMapScale = mapNav.scale; } diff --git a/style.css b/style.css index f6ca653..55e196d 100644 --- a/style.css +++ b/style.css @@ -1,15 +1,6 @@ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wdth,wght@0,62.5..100,100..900;1,62.5..100,100..900&family=Protest+Strike&display=swap'); :root{ - --signScale: 1; - --cullThreshold_state_0: none; - --cullThreshold_state_1: none; - --cullThreshold_state_2: none; - --cullThreshold_state_3: none; - --cullThreshold_state_4: none; - --cullThreshold_state_5: none; - --cullThreshold_state_6: none; - --absScale: 1; --legendButtonSize: 50px; }