kengetallenboek:winkelstraten:profiel1 [Sumsonite]

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== Profiel 1: Gebakken straatsteen / State of the art verlichting / Geen openbaar groen ======

{{handleiding_nieuw:kengetallen:winkel_profiel1_foto.jpg?1000}}

^ Winkelstraatprofiel ^ Kostprijs ^
| {{handleiding_nieuw:kengetallen:winkel_profiel1_schets.jpg?600}} | <html><div style="text-align: center; font-size: 140%; line-height: 1.4; vertical-align: middle;"><strong>€ 1.900 per m¹</strong><br><strong>€ 213 per m²</strong></div></html> |

**Beschrijving:**
  * Rabatstrook: tegels variabel formaat, natuursteen look  
  * Verblijfsgebied: gebakken straatsteen dikformaat, geen kantopsluiting  
  * Riolering: gescheiden stelsel  
  * Elementen: borden, brandkraan  
  * Verlichting: state of the art verlichting aan gevel  
  * Openbaar groen: geen  
  * Profielbreedte: 7 meter

----

==== ♻️ Klimaatadaptieve maatregelen ====

<html>
<style>
  .klimaatformulier {
    background: #f4f4f4;
    border: 1px solid #ccc;
    padding: 1em;
    width: 100%;
    max-width: 750px;
    border-radius: 8px;
    font-family: sans-serif;
    margin-top: 1em;
    font-size: 16px;
  }
  .klimaatformulier label {
    display: flex;
    align-items: center;
    gap: 0.6em;
    margin: 0.5em 0;
  }
  .klimaatformulier label img {
    height: 32px;
    width: 32px;
  }
  .klimaatformulier .resultaat {
    margin-top: 1em;
    font-weight: bold;
    font-size: 1.2em;
    border-top: 1px solid #999;
    padding-top: 0.8em;
  }
  .klimaatformulier .intro {
    font-weight: bold;
    border-bottom: 1px solid #ccc;
    padding-bottom: 0.5em;
    margin-bottom: 1em;
  }
</style>

<div class="klimaatformulier">
  <div class="intro">
    <p>Basisprijs profiel: € <span id="basisprijs">1900</span> per strekkende meter</p>
    <p>Breedte profiel: <span id="profielbreedte">7</span> meter → 1 m¹ = <span id="m2prijs">€ 213</span> per m²</p>
  </div>

  <form id="klimaat-form">
    <label><input type="checkbox" value="131"> <img src="/wiki/lib/exe/fetch.php?media=handleiding_nieuw:kengetallen:icoontjes:waterpasserend.png"> Waterpasserend (+ €131)</label>
    <label><input type="checkbox" value="60"> <img src="/wiki/lib/exe/fetch.php?media=handleiding_nieuw:kengetallen:icoontjes:groene_halfverharding.png"> Groene halfverharding (+ €60)</label>
    <label><input type="checkbox" value="54"> <img src="/wiki/lib/exe/fetch.php?media=handleiding_nieuw:kengetallen:icoontjes:infiltratiekratten.png"> Infiltratiekratten (+ €54)</label>
    <label><input type="checkbox" value="329"> <img src="/wiki/lib/exe/fetch.php?media=handleiding_nieuw:kengetallen:icoontjes:waterberging.png"> Waterberging onder straatprofiel (+ €329)</label>
    <label><input type="checkbox" value="28"> <img src="/wiki/lib/exe/fetch.php?media=handleiding_nieuw:kengetallen:icoontjes:infiltratie_riool.png"> Infiltratie riool (+ €28)</label>
    <label><input type="checkbox" value="14"> <img src="/wiki/lib/exe/fetch.php?media=handleiding_nieuw:kengetallen:icoontjes:dit_riool.png"> DIT riool (+ €14)</label>
  </form>

  <div class="resultaat">
    Totale kostprijs: € <span id="totaalprijs">1900</span> per m¹ ≈ <span id="m2prijsresult">€ 213</span> per m²
  </div>
</div>

<script>
(() => {
  const basisprijs = 1900;
  const profielbreedte = 7;

  const checkboxes = document.querySelectorAll('#klimaat-form input[type="checkbox"]');
  const totaalveld = document.getElementById('totaalprijs');
  const m2veld = document.getElementById('m2prijsresult');

  function updatePrijs() {
    let totaal = basisprijs;
    checkboxes.forEach(cb => {
      if (cb.checked) totaal += parseFloat(cb.value);
    });
    totaalveld.textContent = totaal.toFixed(2);
    const m2 = totaal / profielbreedte;
    m2veld.textContent = m2.toFixed(2);
  }

  checkboxes.forEach(cb => cb.addEventListener('change', updatePrijs));
})();
</script>
</html>

----

[[handleiding_nieuw:sub_winkelstraten|← Terug naar overzicht]]