User Tools

Site Tools

Trace:
handleiding_nieuw:sub_spacematrix

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
handleiding_nieuw:sub_spacematrix [2025/05/09 13:57] – external edit 127.0.0.1handleiding_nieuw:sub_spacematrix [2025/11/27 06:51] (current) – support
Line 29: Line 29:
 <body> <body>
  
-<h1>Spacematrix & Voorzieningen</h1>+<h1>Stedelijke Dichtheidsrekenmachine</h1>
 <div class="tabs"> <div class="tabs">
   <div class="tab active" onclick="switchTab('rekenblok')">Spacematrix Rekenblok</div>   <div class="tab active" onclick="switchTab('rekenblok')">Spacematrix Rekenblok</div>
Line 59: Line 59:
     </div>     </div>
     <div class="kaartcontainer" style="max-width: 500px;">     <div class="kaartcontainer" style="max-width: 500px;">
-      <img src="https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:SPACEMATE1.png" alt="Spacematrix kaart">+      <img src="/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:SPACEMATE1.png" alt="Spacematrix kaart">
       <div class="stipje" id="stipje"></div>       <div class="stipje" id="stipje"></div>
     </div>     </div>
Line 107: Line 107:
      
   <div style="margin-top: 20px;">   <div style="margin-top: 20px;">
-  <button onclick="downloadKickstartDump()" style="padding: 10px 20px; font-size: 1rem; background-color: #0074d9; color: white; border: none; border-radius: 5px; cursor: pointer;">+  <button onclick="downloadKickstartDump()" style="padding: 10px 20px; font-size: 1rem; background-color: #0074d9; color: black; border: none; border-radius: 5px; cursor: pointer;">
     📄 Kickstart Dump downloaden     📄 Kickstart Dump downloaden
   </button>   </button>
Line 257: Line 257:
 function updateStipje(fsi, gsi) { function updateStipje(fsi, gsi) {
   const stip = document.getElementById("stipje");   const stip = document.getElementById("stipje");
-  const x = Math.min(100, Math.max(0, gsi * 190)); + 
-  const y = Math.max(0, Math.min(100, (3 - fsi) * 35));+  // Afbeeldingskalibratie (pixels of procenten afhankelijk van verhoudingen) 
 +  // GSI 0 → linksrand, GSI 0.5 → ongeveer 90% breedte 
 +  const x = Math.min(100, Math.max(0, (gsi / 0.5) * 70+ 6));   // pas 70 en 6 aan voor horizontale correctie 
 + 
 +  // FSI 0 → onderrand, FSI 3 → bovenzijde (ongeveer 5% marge boven) 
 +  const y = Math.max(0, Math.min(100, 92 - (fsi / 3) * 88));   // pas 93 en 88 aan voor verticale correctie 
   stip.style.left = `${x}%`;   stip.style.left = `${x}%`;
   stip.style.top = `${y}%`;   stip.style.top = `${y}%`;
Line 610: Line 616:
 } }
  
-// 👇 Deze functies zetten de HTML-invoer van de rekenmodule om in tekstblokken voor het .docx-bestand +// 👇 Bouw de volledige woningtype + parkeren-tabel met eerste kolom labels, geschikt voor Kladblok 
- +function buildWoningtypesTableTXT() {
-function buildWoningtypesTable() {+
   const types = ["egw sociaal", "egw goedkoop", "egw midden", "egw duur", "egw top",   const types = ["egw sociaal", "egw goedkoop", "egw midden", "egw duur", "egw top",
                  "mgw sociaal", "mgw goedkoop", "mgw midden", "mgw duur", "mgw top"];                  "mgw sociaal", "mgw goedkoop", "mgw midden", "mgw duur", "mgw top"];
-  let rows = [ +  const parkeerkolommen = ["Park. bov.", "Park. ond."]; 
-    ["Type", ...types, "Parkeren bovengr.", "Parkeren ondergr."] +  const kolommen = [...types, ...parkeerkolommen]; 
-  ];+  const colWidth = 13; 
 +  const labelWidth = 18;
  
-  const perc = types.map((_, i) => document.getElementById(`perc_${i}`).value || "0"); +  const pad = (val) => val.toString().padStart(colWidth); 
-  const bvo = types.map((_, i) => document.getElementById(`bvo_${i}`).value || "0"); +  const head = (val) => val.toString().padEnd(colWidth); 
-  const aantallen = types.map((_, i) => document.getElementById(`aantal_${i}`).innerText || "-"); +  const label = (txt) => `| ${txt}`.padEnd(labelWidth);
-  const bvo_tot = types.map((_, i) => document.getElementById(`totbvo_${i}`).innerText || "-");+
  
-  rows.push(["% totaal", ...perc, "-", "-"]); +  // DATA per woningtype (alleen types, dus zonder parkeren) 
-  rows.push(["m² BVO per woning", ...bvo, "25", "25"]); +  const perc = types.map((_, i) => document.getElementById(`perc_${i}`)?.value || "0"); 
-  rows.push(["Aantal woningen", ...aantallen, "56", "56"]); +  const bvo = types.map((_, i) => parseFloat(document.getElementById(`bvo_${i}`)?.value || "0")); 
-  rows.push(["Totaal BVO", ...bvo_tot, "1400", "1400"]);+  const aantallen = types.map((_, i) => parseInt(document.getElementById(`aantal_${i}`)?.innerText || "0")); 
 +  const vormfactor = types.map((_, i) => i < 5 ? 0.9 : 0.75); 
 +  const bvo_tot = bvo.map((b, i) => b * aantallen[i]); 
 +  const gbo = bvo.map((b, i) => (b * vormfactor[i]).toFixed(1));
  
-  return rows.map(r => r.join(" | ")).join("\n"); +  // PARKEERREGELS berekenen 
-}+  const pp = parseFloat(document.getElementById("pp_per_woning")?.value || 1); 
 +  const woningen = aantallen.reduce((acc, val) => acc + (val || 0), 0); // alleen woningtypes 
 +  const bvo_pp = parseFloat(document.getElementById("bvo_per_pp")?.value || 25); 
 +  const perc_boven = parseFloat(document.getElementById("pp_bovengronds")?.value || 70); 
 +  const perc_onder = parseFloat(document.getElementById("pp_ondergronds")?.value || 30); 
 +  const pp_boven = Math.round(woningen * pp * (perc_boven / 100)); 
 +  const pp_onder = Math.round(woningen * pp * (perc_onder / 100)); 
 +  const bvo_boven = pp_boven * bvo_pp; 
 +  const bvo_onder = pp_onder * bvo_pp;
  
-function buildVoorzieningenTable() { +  // PARKEERGEGEVENS toevoegen 
-  const voorzieningen = [ +  perc.push("-", "-"); 
-    { naam: "Huisarts" }, { naam: "Fysiotherapie" }, { naam: "Tandarts" }, +  bvo.push(bvo_pp, bvo_pp); 
-    { naam: "Kinderopvang" }, { naam: "Basisschool" }, { naam: "Bibliotheek" }, +  aantallen.push(pp_boven, pp_onder); 
-    { naam: "Buurtcentrum" }, { naam: "Sporthal" }, { naam: "Zwemmen (overdekt)" }, +  bvo_tot.push(bvo_boven, bvo_onder); 
-    { naam: "Winkels dagelijks goed." } +  vormfactor.push(1.00, 1.00); 
-  ]; +  gbo.push((bvo_pp * 1.00).toFixed(1), (bvo_pp * 1.00).toFixed(1));
-  let rows = ["Type | Oppervlak (m²)"];+
  
-  voorzieningen.forEach((v, i) => { +  // TABEL opbouwen 
-    const row = document.getElementById(`vchk_${i}`); +  const r = []; 
-    if (row && row.checked) { +  r.push(label("Type") + kolommen.map(head).join("|") + "|"); 
-      const el = document.querySelector(`#voorziening_summary_tabel tr:nth-child(${rows.length}) td:last-child`); +  r.push("".padEnd(labelWidth, " ") + kolommen.map(() => "-".repeat(colWidth)).join("|") + "|"); 
-      const m2 = el ? el.innerText : "-"; +  r.push(label("% totaal") + perc.map(pad).join("|") + "|"); 
-      rows.push(`${v.naam} | ${m2}`); +  r.push(label("Aantal woningen") + aantallen.map(pad).join("|") + "|"); 
-    } +  r.push(label("Totaal BVO") + bvo_tot.map(b => pad(b.toFixed(0))).join("|") + "|"); 
-  });+  r.push(label("m² BVO/woning") + bvo.map(b => pad(b.toFixed(0))).join("|") + "|"); 
 +  r.push(label("m² GBO/woning") + gbo.map(pad).join("|") + "|"); 
 +  r.push(label("Vormfactor") + vormfactor.map(f => pad(f.toFixed(2))).join("|") + "|");
  
-  return rows.join("\n"); +  // GEMIDDELDES (alleen woningtypes, dus index 0 t/m 9) 
-}+  const woningtypes = [...Array(10).keys()]; 
 +  const totale_bvo = woningtypes.reduce((sum, i) => sum + bvo[i] * aantallen[i], 0); 
 +  const totale_gbo = woningtypes.reduce((sum, i) => sum + parseFloat(gbo[i]) * aantallen[i], 0); 
 +  const totaal_woningen = woningtypes.reduce((sum, i) => sum + aantallen[i], 0);
  
-function buildPlankaartTable() { +  const gemiddelde_bvo = totaal_woningen > 0 ? (totale_bvo / totaal_woningen).toFixed(1) : "0"; 
-  const ids = ["opp", "m2_groen", "m2_water", "m2_tuinen", "m2_rijbanen", "m2_trottoirs", "m2_parkeren", "m2_pleinen"]; +  const gemiddelde_gbo = totaal_woningen > 0 ? (totale_gbo / totaal_woningen).toFixed(1) : "0";
-  const labels = ["Totaal bruto plangebied", "Groen", "Water", "Tuinen", "Rijbanen", "Trottoirs", "Parkeren (bovengr.)", "Pleinen"]; +
- +
-  const footprint = parseFloat(document.getElementById("gsi").value || 0) * parseFloat(document.getElementById("opp").value || 0); +
-  const tuin = parseFloat(document.getElementById("m2_tuinen").innerText) || 0; +
-  const verharding = ["m2_rijbanen", "m2_trottoirs", "m2_parkeren", "m2_pleinen"] +
-    .map(id => parseFloat(document.getElementById(id).innerText) || 0) +
-    .reduce((a, b) => a + b, 0); +
- +
-  let rows = ["Omschrijving | Oppervlak (m²)"]; +
-  ids.forEach((id, i) => { +
-    const el = document.getElementById(id); +
-    if (el) { +
-      rows.push(`${labels[i]} | ${el.value || el.innerText || '-'}`); +
-    } +
-  }); +
-  rows.push(`Footprint (GSI x opp) | ${footprint.toFixed(0)} m²`); +
-  rows.push(`Totaal uitgeefbaar | ${(footprint + tuin).toFixed(0)} m²`); +
-  rows.push(`Totaal verharding | ${verharding.toFixed(0)} m²`); +
- +
-  return rows.join("\n"); +
-}+
  
-function buildGrexTable() { +  r.push(""); 
-  const getVal = id => parseFloat(document.getElementById(id)?.innerText?.replace(' m²', '') || 0); +  r.push(`Totale aantal woningen: ${totaal_woningen}`); 
-  const rijbanen = getVal("m2_rijbanen"); +  r.push(`Gemiddelde BVO per woning: ${gemiddelde_bvo}`); 
-  const trottoirs = getVal("m2_trottoirs"); +  r.push(`Gemiddelde GBO per woning: ${gemiddelde_gbo}`);
-  const parkeren = getVal("m2_parkeren"); +
-  const pleinen = getVal("m2_pleinen"); +
-  const groen = getVal("m2_groen"); +
-  const water = getVal("m2_water"); +
-  const totaalopp = parseFloat(document.getElementById("opp")?.value || 0); +
-  const nazorg = rijbanen * 0.10;+
  
-  return [ +  return r.join("\n");
-    "Categorie | Omschrijving | Oppervlak (m²)", +
-    `Verwerving | Percelen te verwerven of in te brengen | ${totaalopp.toFixed(0)}`, +
-    `Grondwerk | Graven watergangen | ${water.toFixed(0)}`, +
-    `Bouwrijp maken | Bouwstraten | ${rijbanen.toFixed(0)}`, +
-    `Woonrijp maken | Rijbanen | ${rijbanen.toFixed(0)}`, +
-    `Woonrijp maken | Trottoirs | ${trottoirs.toFixed(0)}`, +
-    `Woonrijp maken | Parkeren | ${parkeren.toFixed(0)}`, +
-    `Woonrijp maken | Pleinen | ${pleinen.toFixed(0)}`, +
-    `Woonrijp maken | Groen | ${groen.toFixed(0)}`, +
-    "Woonrijp maken | Bomen en groenstructuur |", +
-    "Woonrijp maken | Verdere aankleding openbare ruimte |", +
-    `Nazorg | Herstraten bestratingen (10% rijbanen) | ${nazorg.toFixed(0)}`, +
-    "Onvoorzien | Onvoorzien (5-15%) |" +
-  ].join("\n");+
 } }
  
Line 709: Line 688:
  
   try {   try {
-    const response = await fetch('https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:kickstart_template_final.txt&v=' + Date.now());+    const response = await fetch('https://login.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:kickstart_template_final.txt&v=' + Date.now());
     if (!response.ok) throw new Error(`Bestand niet bereikbaar (${response.status})`);     if (!response.ok) throw new Error(`Bestand niet bereikbaar (${response.status})`);
  
Line 740: Line 719:
       totbvo_boven: parkeeropp_boven.toFixed(0),       totbvo_boven: parkeeropp_boven.toFixed(0),
       totbvo_onder: parkeeropp_onder.toFixed(0),       totbvo_onder: parkeeropp_onder.toFixed(0),
-      voorzieningen_table: buildVoorzieningenTableTXT(),+      woningtypes_table: buildWoningtypesTableTXT(), 
 +   voorzieningen_table: buildVoorzieningenTableTXT(),
       plankaart_table: buildPlankaartTableTXT(),       plankaart_table: buildPlankaartTableTXT(),
       grex_table: buildGrexTableTXT()       grex_table: buildGrexTableTXT()
Line 780: Line 760:
  
 function buildPlankaartTableTXT() { function buildPlankaartTableTXT() {
 +  const opp = parseFloat(document.getElementById("opp").value) || 0;
 +  const gsi = parseFloat(document.getElementById("gsi").value) || 0;
 +  const footprint = gsi * opp;
 +  const tuin = getVal("m2_tuinen");
 +  const uitgeefbaar = tuin + footprint;
 +
   return `Omschrijving                | Oppervlak (m²)   return `Omschrijving                | Oppervlak (m²)
 ----------------------------|---------------- ----------------------------|----------------
-Totaal bruto plangebied     | ${document.getElementById("opp").value}+Totaal bruto plangebied     | ${opp}
 ----------------------------|---------------- ----------------------------|----------------
-Tuinen                      | ${getVal("m2_tuinen")} +Tuinen                      | ${tuin} 
-Footprint (GSI x opp)       | ${(parseFloat(document.getElementById("gsi").value) * parseFloat(document.getElementById("opp").value)).toFixed(0)}+Footprint (GSI x opp)       | ${footprint.toFixed(0)}
 ----------------------------|---------------- ----------------------------|----------------
-Totaal uitgeefbaar          | ${getVal("m2_tuinen") + (parseFloat(document.getElementById("gsi").value) * parseFloat(document.getElementById("opp").value)).toFixed(0)}+Totaal uitgeefbaar          | ${uitgeefbaar.toFixed(0)}
 Rijbanen                    | ${getVal("m2_rijbanen")} Rijbanen                    | ${getVal("m2_rijbanen")}
 Trottoirs                   | ${getVal("m2_trottoirs")} Trottoirs                   | ${getVal("m2_trottoirs")}
Line 793: Line 779:
 Pleinen                     | ${getVal("m2_pleinen")} Pleinen                     | ${getVal("m2_pleinen")}
 ----------------------------|---------------- ----------------------------|----------------
-Totaal verharding           | ${getVal("m2_rijbanen") + getVal("m2_trottoirs") + getVal("m2_parkeren") + getVal("m2_pleinen")}+Totaal verharding           | ${(getVal("m2_rijbanen") + getVal("m2_trottoirs") + getVal("m2_parkeren") + getVal("m2_pleinen")).toFixed(0)}
 Groen                       | ${getVal("m2_groen")} Groen                       | ${getVal("m2_groen")}
 Water                       | ${getVal("m2_water")}`; Water                       | ${getVal("m2_water")}`;
handleiding_nieuw/sub_spacematrix.1746799073.txt.gz · Last modified: 2025/05/09 13:57 by 127.0.0.1