{"id":2871,"date":"2026-10-26T07:45:21","date_gmt":"2026-10-26T05:45:21","guid":{"rendered":"https:\/\/cad-kompass.de\/?p=2871"},"modified":"2026-10-26T07:54:43","modified_gmt":"2026-10-26T05:54:43","slug":"beschriftungsmassstab-simulator","status":"publish","type":"post","link":"https:\/\/cad-kompass.de\/?p=2871","title":{"rendered":"Beschriftungsma\u00dfstab-Simulator"},"content":{"rendered":"\n<style>\n    .bm-box {\n        --bm-primary: #3f5f75;\n        --bm-primary-dark: #2c4a5e;\n        --bm-primary-deep: #1e3548;\n        --bm-ink: #1e293b;\n        --bm-text: #334155;\n        --bm-muted: #64748b;\n        --bm-border: #c8d6e0;\n        --bm-surface: #f7f9fb;\n        --bm-good: #059669;\n        --bm-good-deep: #15803d;\n        --bm-warn: #d97706;\n        --bm-warn-deep: #92700c;\n        --bm-warn-border: #f4cf81;\n        --bm-error: #dc2626;\n        --bm-accent: #e8913a;\n        --bm-accent-deep: #b45309;\n        background: var(--bm-surface);\n        border: 3px solid var(--bm-primary);\n        border-radius: 8px;\n        margin: 28px 0;\n        overflow: hidden;\n        position: relative;\n        font-family: inherit;\n        color: var(--bm-text);\n        line-height: 1.55;\n    }\n    .bm-box, .bm-box *, .bm-box *::before, .bm-box *::after { box-sizing: border-box; }\n\n    .bm-header {\n        background: linear-gradient(135deg, var(--bm-primary-deep) 0%, var(--bm-primary-dark) 100%);\n        padding: 20px 28px 18px;\n        position: relative;\n    }\n    .bm-header::after {\n        content: '';\n        position: absolute;\n        left: 0; right: 0; bottom: 0;\n        height: 3px;\n        background: repeating-linear-gradient(90deg, var(--bm-primary) 0px, var(--bm-primary) 8px, transparent 8px, transparent 12px);\n    }\n    .bm-header-top { display: flex; align-items: center; gap: 14px; }\n    .bm-header-icon { width: 36px; height: 36px; flex-shrink: 0; }\n    .bm-box-title { font-size: 1.15rem; color: #fff; font-weight: 700; margin: 0; letter-spacing: -0.01em; }\n    .bm-box-desc { font-size: 0.85rem; color: rgba(255,255,255,0.68); margin: 6px 0 0; line-height: 1.55; }\n\n    .bm-body { padding: 22px 28px 24px; }\n    .bm-privacy {\n        background: #f0fdf4;\n        border: 1px solid #bbf7d0;\n        border-radius: 3px;\n        padding: 9px 14px;\n        margin-bottom: 16px;\n        font-size: 0.8rem;\n        color: var(--bm-good-deep);\n        line-height: 1.5;\n        display: flex;\n        align-items: center;\n        gap: 8px;\n    }\n    .bm-privacy::before { content: '\\1F512'; flex-shrink: 0; font-size: 0.9rem; }\n    .bm-intro {\n        background: #f0f5fa;\n        border-left: 3px solid var(--bm-primary);\n        border-radius: 0 4px 4px 0;\n        padding: 11px 15px;\n        margin-bottom: 12px;\n        font-size: 0.86rem;\n        color: var(--bm-text);\n    }\n    .bm-intro strong { color: var(--bm-ink); }\n\n    .bm-merkrow { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }\n    .bm-merk-chip {\n        display: inline-flex;\n        align-items: center;\n        gap: 6px;\n        padding: 5px 11px;\n        border-radius: 4px;\n        font-size: 0.74rem;\n        font-weight: 700;\n        background: #edf4f8;\n        border: 1px solid #cfe0ea;\n        color: var(--bm-primary-deep);\n        line-height: 1.4;\n    }\n    .bm-merk-chip.bm-is-muted { background: #f1f3f5; border-color: #dde2e6; color: var(--bm-muted); }\n    .bm-merk-chip b { font-weight: 800; }\n\n    .bm-section-label {\n        font-size: 0.66rem;\n        font-weight: 800;\n        text-transform: uppercase;\n        letter-spacing: 0.1em;\n        color: var(--bm-muted);\n        margin: 0 0 8px;\n    }\n\n    .bm-verdict-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }\n    .bm-verdict { border: 1px solid var(--bm-border); border-radius: 4px; background: #fff; padding: 12px 16px; min-width: 0; }\n    .bm-verdict.bm-is-live { border-left: 3px solid var(--bm-primary); border-radius: 0 4px 4px 0; }\n    .bm-verdict-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-bottom: 8px; }\n    .bm-verdict-title {\n        font-size: 0.66rem;\n        font-weight: 800;\n        text-transform: uppercase;\n        letter-spacing: 0.1em;\n        color: var(--bm-muted);\n    }\n    .bm-chip {\n        display: inline-flex;\n        align-items: center;\n        min-height: 22px;\n        padding: 2px 10px;\n        border-radius: 999px;\n        font-size: 0.72rem;\n        font-weight: 800;\n        background: #edf4f8;\n        border: 1px solid #cfe0ea;\n        color: var(--bm-primary-deep);\n        font-variant-numeric: tabular-nums;\n    }\n    .bm-chip.bm-is-good { background: #f0fdf4; border-color: #bbf7d0; color: var(--bm-good-deep); }\n    .bm-chip.bm-is-accent { background: #fdf1e4; border-color: #f3d2a4; color: var(--bm-accent-deep); }\n    .bm-chip.bm-is-warn { background: #fffbeb; border-color: #f4cf81; color: var(--bm-warn-deep); }\n    .bm-verdict-text { font-size: 0.85rem; line-height: 1.6; color: var(--bm-text); margin: 0; }\n    .bm-verdict-text strong { color: var(--bm-ink); }\n\n    .bm-svg-wrap {\n        border: 1px solid var(--bm-border);\n        border-radius: 4px;\n        background: #fff;\n        padding: 12px 14px 10px;\n        margin-bottom: 14px;\n    }\n    .bm-svg-wrap svg { width: 100%; height: auto; display: block; font-family: inherit; user-select: none; }\n\n    .bm-legend {\n        display: flex;\n        flex-wrap: wrap;\n        gap: 9px 14px;\n        align-items: center;\n        margin-top: 9px;\n        padding-top: 9px;\n        border-top: 1px solid #edf2f7;\n        font-size: 0.73rem;\n        color: var(--bm-muted);\n    }\n    .bm-legend-item { display: inline-flex; align-items: center; gap: 5px; }\n    .bm-line-swatch { width: 20px; height: 0; border-top: 3px solid currentColor; border-radius: 999px; }\n    .bm-dot-swatch { width: 10px; height: 10px; border-radius: 50%; border: 2px solid currentColor; background: #fff; }\n    .bm-rect-swatch { width: 13px; height: 10px; border: 2px solid currentColor; border-radius: 2px; background: #fff; }\n    .bm-rect-swatch.bm-is-dashed { border-style: dashed; }\n\n    .bm-formula {\n        border: 1px solid var(--bm-border);\n        border-radius: 4px;\n        background: #eef4f8;\n        padding: 11px 15px;\n        margin-bottom: 14px;\n    }\n    .bm-formula-line { font-size: 0.92rem; color: var(--bm-primary-deep); font-weight: 700; margin: 0; font-variant-numeric: tabular-nums; }\n    .bm-formula-line strong { color: var(--bm-ink); font-size: 1rem; }\n    .bm-tile-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; margin-top: 10px; }\n    .bm-tile {\n        background: #fff;\n        border: 1px solid #dde7ee;\n        border-radius: 3px;\n        padding: 7px 9px;\n        min-width: 0;\n    }\n    .bm-tile-label {\n        display: block;\n        color: var(--bm-muted);\n        font-size: 0.6rem;\n        font-weight: 800;\n        text-transform: uppercase;\n        letter-spacing: 0.05em;\n    }\n    .bm-tile-value {\n        display: block;\n        color: var(--bm-ink);\n        font-size: 0.88rem;\n        font-weight: 800;\n        font-variant-numeric: tabular-nums;\n        margin-top: 2px;\n    }\n\n    .bm-controls {\n        border: 1px solid var(--bm-border);\n        border-radius: 4px;\n        background: var(--bm-surface);\n        padding: 14px 16px 16px;\n        display: grid;\n        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n        gap: 16px 22px;\n        align-items: start;\n        margin-bottom: 4px;\n    }\n    .bm-control-block { min-width: 0; }\n    .bm-field { margin-bottom: 14px; }\n    .bm-field:last-child { margin-bottom: 0; }\n    .bm-field-label { display: flex; justify-content: space-between; gap: 8px; font-size: 0.76rem; font-weight: 800; color: var(--bm-ink); margin-bottom: 6px; }\n    .bm-field-unit { color: var(--bm-muted); font-size: 0.74rem; font-weight: 700; font-variant-numeric: tabular-nums; }\n    .bm-select-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }\n    .bm-btn-col { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }\n\n    .bm-box .bm-range {\n        -webkit-appearance: none !important;\n        -moz-appearance: none !important;\n        appearance: none !important;\n        width: 100% !important;\n        height: 6px !important;\n        padding: 0 !important;\n        margin: 8px 0 2px !important;\n        background: #dbe4ec !important;\n        border: 0 !important;\n        border-radius: 3px !important;\n        outline: none !important;\n        box-shadow: none !important;\n        box-sizing: border-box !important;\n        accent-color: var(--bm-primary);\n    }\n    .bm-box .bm-range::-webkit-slider-runnable-track {\n        -webkit-appearance: none !important;\n        appearance: none !important;\n        height: 6px !important;\n        background: transparent !important;\n        border: 0 !important;\n        box-shadow: none !important;\n    }\n    .bm-box .bm-range::-webkit-slider-thumb {\n        -webkit-appearance: none !important;\n        appearance: none !important;\n        width: 18px !important;\n        height: 18px !important;\n        border-radius: 50% !important;\n        background: var(--bm-primary) !important;\n        border: 2px solid #fff !important;\n        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;\n        margin-top: -6px !important;\n        cursor: pointer !important;\n    }\n    .bm-box .bm-range::-moz-range-track {\n        height: 6px !important;\n        background: transparent !important;\n        border: 0 !important;\n        box-shadow: none !important;\n    }\n    .bm-box .bm-range::-moz-range-thumb {\n        -moz-appearance: none !important;\n        appearance: none !important;\n        width: 18px !important;\n        height: 18px !important;\n        border-radius: 50% !important;\n        background: var(--bm-primary) !important;\n        border: 2px solid #fff !important;\n        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;\n        cursor: pointer !important;\n    }\n    .bm-box .bm-range::-moz-focus-outer { border: 0 !important; }\n    .bm-box .bm-range:focus-visible { outline: 2px solid var(--bm-primary) !important; outline-offset: 4px !important; border-radius: 3px !important; }\n    .bm-box .bm-range:disabled { opacity: 0.42 !important; cursor: not-allowed !important; }\n    .bm-box .bm-range:disabled::-webkit-slider-thumb { background: #aab8c2 !important; }\n    .bm-box .bm-range:disabled::-moz-range-thumb { background: #aab8c2 !important; }\n\n    \/* Segment fuer den Zeichnungsmassstab: sieben Werte, deshalb einzeln umrandete Felder mit Umbruch *\/\n    .bm-seg { display: flex; flex-wrap: wrap; gap: 4px; }\n    .bm-box .bm-seg button {\n        -webkit-appearance: none !important;\n        appearance: none !important;\n        font-family: inherit !important;\n        font-size: 0.73rem !important;\n        font-weight: 800 !important;\n        line-height: 1.2 !important;\n        color: var(--bm-text) !important;\n        background: #fff !important;\n        border: 1px solid var(--bm-border) !important;\n        border-radius: 3px !important;\n        min-height: 34px !important;\n        min-width: 0 !important;\n        margin: 0 !important;\n        padding: 6px 10px !important;\n        cursor: pointer !important;\n        box-shadow: none !important;\n        text-transform: none !important;\n        font-variant-numeric: tabular-nums;\n        transition: background-color 0.15s, color 0.15s;\n    }\n    .bm-box .bm-seg button.bm-is-active { background: var(--bm-primary) !important; color: #fff !important; border-color: var(--bm-primary) !important; }\n    .bm-box .bm-seg button:hover:not(.bm-is-active) { background: #edf4f8 !important; color: var(--bm-primary) !important; border-color: #a9bfcf !important; }\n    .bm-box .bm-seg button.bm-is-active:hover { background: var(--bm-primary-dark) !important; color: #fff !important; }\n    .bm-box .bm-seg button:active { background: #e2ecf2 !important; color: var(--bm-primary-deep) !important; }\n    .bm-box .bm-seg button:focus-visible { outline: 2px solid var(--bm-primary) !important; outline-offset: 1px !important; }\n    .bm-box .bm-seg button:disabled { opacity: 0.5 !important; cursor: not-allowed !important; }\n\n    \/* Auswahlfeld (Standardmassstab), gegen Theme-Styles gehaertet; Pfeil aus zwei Verlaeufen, ohne Bilddatei *\/\n    .bm-box .bm-select {\n        -webkit-appearance: none !important;\n        -moz-appearance: none !important;\n        appearance: none !important;\n        display: block !important;\n        width: 100% !important;\n        min-height: 36px !important;\n        height: auto !important;\n        margin: 0 !important;\n        padding: 6px 30px 6px 10px !important;\n        font-family: inherit !important;\n        font-size: 0.82rem !important;\n        font-weight: 700 !important;\n        line-height: 1.3 !important;\n        color: var(--bm-ink) !important;\n        background-color: #fff !important;\n        background-image: linear-gradient(45deg, transparent 50%, #3f5f75 50%), linear-gradient(135deg, #3f5f75 50%, transparent 50%) !important;\n        background-position: calc(100% - 17px) 50%, calc(100% - 12px) 50% !important;\n        background-size: 5px 5px, 5px 5px !important;\n        background-repeat: no-repeat !important;\n        border: 1px solid var(--bm-border) !important;\n        border-radius: 3px !important;\n        box-shadow: none !important;\n        box-sizing: border-box !important;\n        cursor: pointer !important;\n        font-variant-numeric: tabular-nums;\n    }\n    .bm-box .bm-select:hover { border-color: #a9bfcf !important; background-color: #f7fafc !important; color: var(--bm-ink) !important; }\n    .bm-box .bm-select:focus-visible { outline: 2px solid var(--bm-primary) !important; outline-offset: 1px !important; border-color: var(--bm-primary) !important; }\n    .bm-box .bm-select:disabled { opacity: 0.5 !important; cursor: not-allowed !important; }\n    .bm-box .bm-select.bm-is-off { border-color: #fca5a5 !important; color: #b91c1c !important; }\n\n    \/* Aktionsknoepfe *\/\n    .bm-box .bm-btn {\n        -webkit-appearance: none !important;\n        appearance: none !important;\n        display: inline-flex !important;\n        align-items: center !important;\n        gap: 6px;\n        font-family: inherit !important;\n        font-size: 0.78rem !important;\n        font-weight: 800 !important;\n        line-height: 1.25 !important;\n        text-align: left !important;\n        text-transform: none !important;\n        color: var(--bm-primary-deep) !important;\n        background: #fff !important;\n        border: 1px solid #a9bfcf !important;\n        border-radius: 3px !important;\n        min-height: 36px !important;\n        margin: 0 !important;\n        padding: 7px 13px !important;\n        cursor: pointer !important;\n        box-shadow: none !important;\n        transition: background-color 0.15s, color 0.15s, border-color 0.15s;\n    }\n    .bm-box .bm-btn:hover { background: #edf4f8 !important; color: var(--bm-primary-deep) !important; border-color: var(--bm-primary) !important; }\n    .bm-box .bm-btn:active { background: #e2ecf2 !important; color: var(--bm-primary-deep) !important; }\n    .bm-box .bm-btn:focus-visible { outline: 2px solid var(--bm-primary) !important; outline-offset: 2px !important; }\n    .bm-box .bm-btn:disabled,\n    .bm-box .bm-btn:disabled:hover { background: #f1f3f5 !important; color: #94a3b8 !important; border-color: #dde2e6 !important; cursor: not-allowed !important; }\n    .bm-box .bm-btn.bm-is-active { background: #fef2f2 !important; color: #b91c1c !important; border-color: #fca5a5 !important; }\n    .bm-box .bm-btn.bm-is-active:hover { background: #fee2e2 !important; color: #991b1b !important; border-color: #dc2626 !important; }\n    .bm-box .bm-btn.bm-is-primary { background: var(--bm-primary) !important; color: #fff !important; border-color: var(--bm-primary) !important; }\n    .bm-box .bm-btn.bm-is-primary:hover { background: var(--bm-primary-dark) !important; color: #fff !important; border-color: var(--bm-primary-dark) !important; }\n    .bm-box .bm-btn.bm-is-primary:active { background: var(--bm-primary-deep) !important; color: #fff !important; }\n    .bm-box .bm-btn.bm-is-primary:disabled,\n    .bm-box .bm-btn.bm-is-primary:disabled:hover { background: #f1f3f5 !important; color: #94a3b8 !important; border-color: #dde2e6 !important; cursor: not-allowed !important; }\n\n    .bm-mini-hint { font-size: 0.74rem; color: var(--bm-muted); line-height: 1.45; margin-top: 6px; }\n    .bm-mini-hint strong { color: var(--bm-ink); }\n\n    \/* SVG-Praesentation: Farben hartkodiert (Safari versteht keine CSS-Variablen in SVG-Attributen) *\/\n    .bm-svg-label { fill: #64748b; font-size: 10px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }\n\n    @media (max-width: 700px) {\n        .bm-header { padding: 16px 20px 14px; }\n        .bm-body { padding: 18px 18px 20px; }\n        .bm-tile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }\n        .bm-verdict-grid { grid-template-columns: 1fr; }\n        .bm-svg-wrap { overflow-x: auto; }\n        .bm-svg-wrap svg { min-width: 560px; }\n    }\n    @media (max-width: 480px) {\n        .bm-select-row { grid-template-columns: 1fr; }\n        .bm-tile-grid { grid-template-columns: 1fr; }\n    }\n    @media (prefers-reduced-motion: reduce) {\n        \/* !important noetig: Accessibility-Override muss beliebige Spezifitaeten der CSS-Box schlagen. *\/\n        .bm-box * { transition: none !important; animation: none !important; }\n    }\n\n    \/* Lokale Darstellung des Simulators; bestehende Farben und Bedienelemente bleiben erhalten. *\/\n    .bm-box .bm-step-title { color: var(--bm-ink); font-size: 1rem; margin: 22px 0 8px; line-height: 1.4; }\n    .bm-box .bm-step-copy { font-size: 0.85rem; margin: 0 0 12px; }\n    .bm-box .bm-scene-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 14px 0; }\n    .bm-box .bm-scene { min-width: 0; border: 1px solid var(--bm-border); border-radius: 4px; background: #fff; overflow: hidden; }\n    .bm-box .bm-scene-head { padding: 10px 14px; background: #edf4f8; font-size: 0.85rem; font-weight: 800; color: var(--bm-primary-deep); }\n    .bm-box .bm-scene svg { width: 100%; height: auto; display: block; }\n    .bm-box .bm-scene-copy { padding: 10px 14px; border-top: 1px solid var(--bm-border); font-size: 0.83rem; line-height: 1.5; }\n    .bm-box .bm-scene-copy strong { display: block; color: var(--bm-ink); }\n    .bm-box .bm-scene-note { display: block; margin-top: 4px; color: var(--bm-muted); font-size: 0.77rem; }\n    .bm-box .bm-scene-copy p { margin: 0; }\n    .bm-box .bm-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }\n    .bm-box .bm-controls .bm-field { margin: 0; }\n    .bm-box .bm-controls.bm-controls-split { border: 0; padding: 0; background: transparent; gap: 12px; align-items: stretch; }\n    .bm-box .bm-controls.bm-controls-split > .bm-field { min-width: 0; border: 1px solid var(--bm-border); border-radius: 4px; padding: 14px 16px 16px; background: #fff; }\n    .bm-box .bm-pane-title { margin: -14px -16px 14px; padding: 12px 16px; border-radius: 3px 3px 0 0; background: #edf4f8; font-size: 1.2rem; font-weight: 800; line-height: 1.3; color: var(--bm-primary-deep); }\n    .bm-box .bm-verdict { margin: 12px 0; }\n    .bm-box .bm-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }\n    .bm-box .bm-btn { max-width: 100%; white-space: normal !important; overflow-wrap: anywhere; }\n    .bm-box .bm-field-label { flex-wrap: wrap; }\n    .bm-box [hidden] { display: none !important; }\n    @media (max-width: 700px) {\n        .bm-box .bm-scene-grid, .bm-box .bm-controls { grid-template-columns: minmax(0, 1fr); }\n        .bm-box .bm-body { padding: 16px 12px; }\n        .bm-box .bm-header { padding: 16px; }\n    }\n<\/style>\n\n<div class=\"bm-box\" data-bm-root>\n    <div class=\"bm-header\">\n        <div class=\"bm-header-top\">\n            <svg class=\"bm-header-icon\" viewBox=\"0 0 36 36\" fill=\"none\" aria-hidden=\"true\"><rect x=\"4\" y=\"21\" width=\"11\" height=\"9\" rx=\"1.2\" stroke=\"rgba(255,255,255,0.9)\" stroke-width=\"1.8\"\/><rect x=\"19\" y=\"8\" width=\"15\" height=\"12\" rx=\"1.2\" stroke=\"rgba(255,255,255,0.9)\" stroke-width=\"1.8\"\/><line x1=\"15\" y1=\"25.5\" x2=\"21\" y2=\"17\" stroke=\"rgba(255,255,255,0.55)\" stroke-width=\"1.4\" stroke-dasharray=\"2 2\"\/><\/svg>\n            <div><h2 class=\"bm-box-title\">Beschriftungsma\u00dfstab-Simulator<\/h2><div class=\"bm-box-desc\">Links das Modell, rechts das Layout: Beobachte am selben Haus, welche Einstellung die Schrift ver\u00e4ndert und welche die Geometrie auf dem Blatt.<\/div><\/div>\n        <\/div>\n    <\/div>\n    <div class=\"bm-body\">\n        <div class=\"bm-privacy\">L\u00e4uft komplett im Browser. Keine Daten verlassen deinen Rechner.<\/div>\n        <div class=\"bm-intro\"><strong>Dasselbe Grundst\u00fcck in zwei Ansichten:<\/strong> 25 \u00d7 20 m mit Haus (10 \u00d7 8 m), T\u00fcr und Zufahrt. <strong>A<\/strong> ist die Beschriftung; die orange Messlatte zeigt ihre H\u00f6he. \u00c4ndere jeweils einen Ma\u00dfstab und beobachte Haus und Schrift.<\/div>\n        <div class=\"bm-controls bm-controls-split\">\n            <div class=\"bm-field\"><h3 class=\"bm-pane-title\">Modell<\/h3><div class=\"bm-field-label\" id=\"bmZLabel\">Zeichnungsma\u00dfstab<\/div><span class=\"bm-seg\" id=\"bmZ\" role=\"group\" aria-labelledby=\"bmZLabel\"><button type=\"button\" data-bm-z=\"100\">1:100<\/button><button type=\"button\" data-bm-z=\"200\">1:200<\/button><button type=\"button\" data-bm-z=\"250\">1:250<\/button><button type=\"button\" data-bm-z=\"500\">1:500<\/button><button type=\"button\" data-bm-z=\"1000\">1:1000<\/button><button type=\"button\" data-bm-z=\"2000\">1:2000<\/button><button type=\"button\" data-bm-z=\"5000\">1:5000<\/button><\/span><div class=\"bm-mini-hint\"><strong>Ver\u00e4ndert die Schrift im Modell.<\/strong><br>Zeichnungseinstellungen \u203a Einheiten und Zone \u203a Ma\u00dfstab<\/div><\/div>\n            <div class=\"bm-field\"><h3 class=\"bm-pane-title\">Layout<\/h3><div class=\"bm-field-label\" id=\"bmVpLabel\">Standardma\u00dfstab<\/div><span class=\"bm-seg\" id=\"bmVp\" role=\"group\" aria-labelledby=\"bmVpLabel\"><button type=\"button\" data-bm-vp=\"100\">1:100<\/button><button type=\"button\" data-bm-vp=\"200\">1:200<\/button><button type=\"button\" data-bm-vp=\"250\">1:250<\/button><button type=\"button\" data-bm-vp=\"500\">1:500<\/button><button type=\"button\" data-bm-vp=\"1000\">1:1000<\/button><button type=\"button\" data-bm-vp=\"2000\">1:2000<\/button><button type=\"button\" data-bm-vp=\"5000\">1:5000<\/button><\/span><div class=\"bm-mini-hint\"><strong>Ver\u00e4ndert die Geometrie auf dem Blatt.<\/strong><br>Eigenschaften-Palette des Ansichtsfensters \u203a Standardma\u00dfstab<\/div><\/div>\n        <\/div>\n        <div class=\"bm-scene-grid\"><div class=\"bm-scene\"><div class=\"bm-scene-head\" id=\"bmModelHead\">Zeichnungsma\u00dfstab 1:500<\/div><svg id=\"bmModelSvg\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 400 300\" role=\"img\" aria-labelledby=\"bmModelTitle bmModelDesc\"><title id=\"bmModelTitle\">Modell \u00b7 Zeichnungsma\u00dfstab 1:500<\/title><desc id=\"bmModelDesc\"><\/desc><defs><clipPath id=\"bmModelClip\"><rect x=\"16\" y=\"16\" width=\"368\" height=\"268\"\/><\/clipPath><\/defs><g id=\"bmModelDraw\"><\/g><\/svg><div class=\"bm-scene-copy\" id=\"bmModelCopy\"><\/div><\/div><div class=\"bm-scene\"><div class=\"bm-scene-head\" id=\"bmPaperHead\">Standardma\u00dfstab 1:500<\/div><svg id=\"bmPaperSvg\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 400 300\" role=\"img\" aria-labelledby=\"bmPaperTitle bmPaperDesc\"><title id=\"bmPaperTitle\">Layout \u00b7 Standardma\u00dfstab 1:500<\/title><desc id=\"bmPaperDesc\"><\/desc><defs><clipPath id=\"bmPaperClip\"><rect x=\"16\" y=\"16\" width=\"368\" height=\"268\"\/><\/clipPath><\/defs><g id=\"bmPaperDraw\"><\/g><\/svg><div class=\"bm-scene-copy\" id=\"bmPaperCopy\"><\/div><\/div><\/div>\n        <div class=\"bm-verdict-grid\">\n            <div class=\"bm-verdict bm-is-live\"><div class=\"bm-verdict-head\"><span class=\"bm-verdict-title\">Im Modell<\/span><span class=\"bm-chip\" id=\"bmChipModel\" aria-hidden=\"true\"><\/span><\/div><p class=\"bm-verdict-text\" id=\"bmVerdictModel\" aria-live=\"polite\"><\/p><\/div>\n            <div class=\"bm-verdict bm-is-live\"><div class=\"bm-verdict-head\"><span class=\"bm-verdict-title\">Auf dem Blatt<\/span><span class=\"bm-chip\" id=\"bmChipSheet\" aria-hidden=\"true\"><\/span><\/div><p class=\"bm-verdict-text\" id=\"bmVerdictSheet\" aria-live=\"polite\"><\/p><\/div>\n        <\/div>\n        <div class=\"bm-controls\">\n            <div class=\"bm-field\"><label class=\"bm-field-label\" for=\"bmText\">Gemeinsame Texth\u00f6he im Stil <span class=\"bm-field-unit\" id=\"bmTextVal\">2,5 mm<\/span><\/label><input class=\"bm-range\" id=\"bmText\" type=\"range\" min=\"1.8\" max=\"5.0\" step=\"0.1\" value=\"2.5\" aria-describedby=\"bmTextHint\"><div class=\"bm-mini-hint\" id=\"bmTextHint\">Die gew\u00fcnschte Papierh\u00f6he. \u00c4ndert die Schrift in <strong>beiden Ansichten<\/strong>.<br>Beschriftungsstil-Editor \u203a Layout \u203a Texth\u00f6he<\/div><\/div>\n            <div class=\"bm-formula\"><p class=\"bm-formula-line\" id=\"bmFormulaText\"><\/p><\/div>\n        <\/div>\n        <div class=\"bm-mini-hint\">In Civil 3D nach Ma\u00dfstabs\u00e4nderungen im Ansichtsfenster REGENALL ausf\u00fchren.<\/div>\n        <div class=\"bm-actions\"><button type=\"button\" class=\"bm-btn\" id=\"bmResetBtn\">Ausgangszustand wiederherstellen<\/button><\/div>\n        <div class=\"bm-legend\"><span class=\"bm-legend-item\"><span class=\"bm-rect-swatch\" style=\"color:#3f5f75;\"><\/span> Grundst\u00fcck mit Haus und Zufahrt<\/span><span class=\"bm-legend-item\" style=\"color:#b45309;\"><span class=\"bm-line-swatch\"><\/span> H\u00f6he der Beschriftung A<\/span><span class=\"bm-legend-item\">Schematische Draufsicht. Im Modell fester Zoom; die mm-Angaben im Layout gelten f\u00fcr den Ausdruck.<\/span><\/div>\n    <\/div>\n<\/div>\n\n<script>\n(function () {\n    \"use strict\";\n    var ROOT = document.querySelector(\"[data-bm-root]\");\n    if (!ROOT) { return; }\n    var SVGNS = \"http:\/\/www.w3.org\/2000\/svg\";\n    var SCALES = [100, 200, 250, 500, 1000, 2000, 5000];\n    var MODEL_PXPM = 8, PAPER_PXPMM = 4;\n    var state;\n    function initialState() { return { z: 500, t: 2.5, vp: 500 }; }\n    function $(id) { return ROOT.querySelector(\"#\" + id); }\n    function clear(n) { while (n.firstChild) { n.removeChild(n.firstChild); } }\n    function fmt(v, decimals) { var f = Math.pow(10, decimals === undefined ? 3 : decimals); return String(Math.round(v * f) \/ f).replace(\".\", \",\"); }\n    function add(parent, name, attrs) {\n        var node = document.createElementNS(SVGNS, name);\n        Object.keys(attrs || {}).forEach(function (key) { node.setAttribute(key, attrs[key]); });\n        parent.appendChild(node); return node;\n    }\n    function rich(node, parts) {\n        clear(node);\n        parts.forEach(function (part) {\n            if (typeof part === \"string\") { node.appendChild(document.createTextNode(part)); }\n            else { var strong = document.createElement(\"strong\"); strong.textContent = part.b; node.appendChild(strong); }\n        });\n    }\n    function copy(id, main, detail, note) {\n        var node = $(id + \"Copy\"); clear(node);\n        var strong = document.createElement(\"strong\"); strong.textContent = main; node.appendChild(strong);\n        var p = document.createElement(\"p\"); p.textContent = detail; node.appendChild(p);\n        var small = document.createElement(\"span\"); small.className = \"bm-scene-note\"; small.textContent = note; node.appendChild(small);\n        $(id + \"Desc\").textContent = main + \" \" + detail + \" \" + note;\n    }\n    function chip(id, label) { var n = $(id); n.textContent = label; n.className = \"bm-chip bm-is-good\"; }\n    function heading(id, text) { $(id + \"Head\").textContent = text.replace(\/^(Modell|Layout) \u00b7 \/, \"\"); $(id + \"Title\").textContent = text; }\n\n    \/\/ Alle Ansichten verwenden dasselbe Objekt in Metern. Strichbreiten bleiben lesbar.\n    function site(parent, x, y, pxPerM, prefix) {\n        var g = add(parent, \"g\", { id: prefix + \"Site\", transform: \"translate(\" + x + \" \" + y + \") scale(\" + pxPerM + \")\" });\n        function shape(name, attrs) { attrs[\"vector-effect\"] = \"non-scaling-stroke\"; return add(g, name, attrs); }\n        shape(\"rect\", { x: 0, y: 0, width: 25, height: 20, fill: \"#eef4f8\" });\n        shape(\"rect\", { x: 9, y: 0, width: 4, height: 10, fill: \"#d9e4ec\" });\n        shape(\"path\", { d: \"M9 0V10M13 0V10\", fill: \"none\", stroke: \"#94a3b8\", \"stroke-width\": 1 });\n        shape(\"path\", { d: \"M9 0H0V20H25V0H13\", fill: \"none\", stroke: \"#3f5f75\", \"stroke-width\": 1.5 });\n        shape(\"rect\", { id: prefix + \"House\", x: 5, y: 10, width: 10, height: 8, fill: \"#fff\" });\n        shape(\"path\", { d: \"M15 15V10H5V18H15V16.2\", fill: \"none\", stroke: \"#3f5f75\", \"stroke-width\": 2 });\n        shape(\"path\", { d: \"M9 10V13.5M5 14H11M11 14V18\", fill: \"none\", stroke: \"#94a3b8\", \"stroke-width\": 1 });\n        \/\/ T\u00fcr\u00f6ffnung und T\u00fcrfl\u00fcgel am rechten Hausrand bleiben im vergr\u00f6\u00dferten Ausschnitt erkennbar.\n        shape(\"path\", { d: \"M15 16.2H13.8M13.8 16.2A1.2 1.2 0 0 1 15 15\", fill: \"none\", stroke: \"#3f5f75\", \"stroke-width\": 1 });\n    }\n    \/\/ Normierte Schriftprobe: tats\u00e4chliche sichtbare H\u00f6he = Messlatte, ohne Font-Metrik oder Mindestgr\u00f6\u00dfen-Klemme.\n    function letter(parent, x, baseline, height, prefix) {\n        add(parent, \"path\", {\n            id: prefix + \"Letter\", d: \"M0 1L0.28 0H0.44L0.72 1H0.55L0.48 0.77H0.24L0.17 1ZM0.29 0.61H0.43L0.36 0.22Z\",\n            transform: \"translate(\" + x + \" \" + (baseline - height) + \") scale(\" + height + \")\",\n            fill: \"#1e293b\", \"fill-rule\": \"evenodd\"\n        });\n        var gx = x + 0.72 * height + 12;\n        add(parent, \"path\", { id: prefix + \"Gauge\", d: \"M\" + (gx - 4) + \" \" + baseline + \"H\" + (gx + 4) + \"M\" + gx + \" \" + baseline + \"V\" + (baseline - height) + \"M\" + (gx - 4) + \" \" + (baseline - height) + \"H\" + (gx + 4), fill: \"none\", stroke: \"#e8913a\", \"stroke-width\": 2 });\n        var measurement = prefix === \"bmModel\" ? fmt(height \/ MODEL_PXPM) + \" m\" : fmt(state.t, 1) + \" mm\";\n        var labelX = height >= 120 ? gx - measurement.length * 8 : gx + 8;\n        var labelY = height >= 120 ? baseline - height - 12 : baseline - height \/ 2 + 4;\n        add(parent, \"rect\", { x: labelX - 3, y: labelY - 14, width: measurement.length * 8 + 6, height: 20, rx: 2, fill: \"#fff\", opacity: 0.96 });\n        var label = add(parent, \"text\", { id: prefix + \"Height\", x: labelX, y: labelY, \"font-family\": \"Arial, Helvetica, sans-serif\", \"font-size\": 13, \"font-weight\": 700, fill: \"#b45309\" });\n        label.textContent = measurement;\n    }\n    function scene(id, x, y, pxPerM, letterX, baseline, height) {\n        var g = $(id + \"Draw\"); clear(g);\n        add(g, \"rect\", { x: 16, y: 16, width: 368, height: 268, rx: 2, fill: \"#fbfaf7\" });\n        var inner = add(g, \"g\", { \"clip-path\": \"url(#\" + id + \"Clip)\" });\n        site(inner, x, y, pxPerM, id);\n        letter(g, letterX, baseline, height, id);\n        add(g, \"rect\", { id: id + \"Frame\", x: 16, y: 16, width: 368, height: 268, rx: 2, fill: \"none\", stroke: \"#c8d6e0\", \"stroke-width\": 1.5 });\n    }\n    function modelScene() {\n        var h = state.t * state.z \/ 1000;\n        scene(\"bmModel\", 40, 108, MODEL_PXPM, 184, 252, h * MODEL_PXPM);\n        heading(\"bmModel\", \"Modell \u00b7 Zeichnungsma\u00dfstab 1:\" + state.z);\n        var note = h * MODEL_PXPM < 6 ? \"Im festen Zoom wird A sehr klein. Die H\u00f6henangabe bleibt hier ablesbar.\" : \"Fester Zoom: Haus und Grundst\u00fcck bleiben gleich gro\u00df, wenn du den Zeichnungsma\u00dfstab \u00e4nderst.\";\n        copy(\"bmModel\", \"A im Modell: \" + fmt(h) + \" m\", \"Hausgrundriss: 10 \u00d7 8 m \u00b7 Grundst\u00fcck: 25 \u00d7 20 m\", note);\n    }\n    function paperScene() {\n        var p = 1000 \/ state.vp * PAPER_PXPMM;\n        \/\/ Bei 1:500 deckungsgleich mit dem Modell; die T\u00fcr bleibt auch bei 1:100 vollst\u00e4ndig im Ausschnitt.\n        var x = 184 - 18 * p, y = 252 - 18 * p;\n        scene(\"bmPaper\", x, y, p, 184, 252, state.t * PAPER_PXPMM);\n        heading(\"bmPaper\", \"Layout \u00b7 Standardma\u00dfstab 1:\" + state.vp);\n        var cropped = x < 16 || y < 16 || x + 25 * p > 384 || y + 20 * p > 284;\n        var note = cropped ? \"Vergr\u00f6\u00dferter Ausschnitt: Teile von Haus und Grundst\u00fcck liegen au\u00dferhalb. T\u00fcr und Beschriftung bleiben im Blick.\" : (state.vp >= 2000 ? \"Das Haus wird auf dem Blatt sehr klein; A beh\u00e4lt seine Texth\u00f6he.\" : \"Ganzes Grundst\u00fcck sichtbar. \u00c4ndere den Standardma\u00dfstab: Das Haus ver\u00e4ndert seine Gr\u00f6\u00dfe, A bleibt gleich hoch.\");\n        copy(\"bmPaper\", \"A auf dem Papier: \" + fmt(state.t, 1) + \" mm\", \"Haus: \" + fmt(10000 \/ state.vp) + \" \u00d7 \" + fmt(8000 \/ state.vp) + \" mm \u00b7 Grundst\u00fcck: \" + fmt(25000 \/ state.vp) + \" \u00d7 \" + fmt(20000 \/ state.vp) + \" mm\", note);\n    }\n    function render() {\n        ROOT.querySelectorAll(\"[data-bm-z]\").forEach(function (b) { var active = Number(b.getAttribute(\"data-bm-z\")) === state.z; b.classList.toggle(\"bm-is-active\", active); b.setAttribute(\"aria-pressed\", String(active)); });\n        $(\"bmText\").value = state.t;\n        $(\"bmTextVal\").textContent = fmt(state.t, 1) + \" mm\";\n        $(\"bmText\").setAttribute(\"aria-valuetext\", fmt(state.t, 1) + \" Millimeter auf dem Papier\");\n        ROOT.querySelectorAll(\"[data-bm-vp]\").forEach(function (b) { var active = Number(b.getAttribute(\"data-bm-vp\")) === state.vp; b.classList.toggle(\"bm-is-active\", active); b.setAttribute(\"aria-pressed\", String(active)); });\n        modelScene(); paperScene();\n        chip(\"bmChipModel\", \"Schrift folgt Zeichnungsma\u00dfstab\");\n        rich($(\"bmVerdictModel\"), [{ b: \"A ist \" + fmt(state.t * state.z \/ 1000) + \" m hoch.\" }, \" Der Zeichnungsma\u00dfstab ver\u00e4ndert die Schriftgr\u00f6\u00dfe im Modell. Die Geometrie des Hauses bleibt dabei gleich gro\u00df.\"]);\n        rich($(\"bmFormulaText\"), [\"Modellh\u00f6he: \", { b: fmt(state.t, 1) + \" mm \u00d7 \" + state.z + \" = \" + fmt(state.t * state.z) + \" mm = \" + fmt(state.t * state.z \/ 1000) + \" m\" }]);\n        chip(\"bmChipSheet\", \"Papierh\u00f6he bleibt konstant\");\n        rich($(\"bmVerdictSheet\"), [{ b: \"A hat \" + fmt(state.t, 1) + \" mm Papierh\u00f6he.\" }, \" Der Standardma\u00dfstab ver\u00e4ndert die Gr\u00f6\u00dfe des Hauses auf dem Blatt. Die vorgesehene Texth\u00f6he bleibt dabei gleich.\"]);\n    }\n    function setScale(scale) {\n        if (SCALES.indexOf(scale) < 0) { return; }\n        state.vp = scale;\n    }\n    ROOT.addEventListener(\"click\", function (event) {\n        var target = event.target.closest ? event.target.closest(\"button\") : null;\n        if (!target || !ROOT.contains(target) || target.disabled) { return; }\n        if (target.hasAttribute(\"data-bm-z\")) { var z = Number(target.getAttribute(\"data-bm-z\")); if (SCALES.indexOf(z) >= 0) { state.z = z; } }\n        else if (target.hasAttribute(\"data-bm-vp\")) { setScale(Number(target.getAttribute(\"data-bm-vp\"))); }\n        else if (target.id === \"bmResetBtn\") { state = initialState(); }\n        else { return; }\n        render();\n    });\n    ROOT.addEventListener(\"input\", function (event) {\n        if (event.target.id !== \"bmText\") { return; }\n        var value = Number(event.target.value);\n        if (!isFinite(value)) { return; }\n        state.t = Math.max(1.8, Math.min(5, Math.round(value * 10) \/ 10));\n        render();\n    });\n    state = initialState();\n    render();\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Beschriftungsma\u00dfstab-Simulator Links das Modell, rechts das Layout: Beobachte am selben Haus, welche Einstellung die Schrift ver\u00e4ndert und welche die Geometrie [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"disabled","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[58],"tags":[],"class_list":["post-2871","post","type-post","status-publish","format-standard","hentry","category-beschriftungen"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":false,"author_link":"https:\/\/cad-kompass.de\/?author=1"},"uagb_comment_info":0,"uagb_excerpt":"Beschriftungsma\u00dfstab-Simulator Links das Modell, rechts das Layout: Beobachte am selben Haus, welche Einstellung die Schrift ver\u00e4ndert und welche die Geometrie [&hellip;]","_links":{"self":[{"href":"https:\/\/cad-kompass.de\/index.php?rest_route=\/wp\/v2\/posts\/2871","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cad-kompass.de\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cad-kompass.de\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cad-kompass.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cad-kompass.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2871"}],"version-history":[{"count":2,"href":"https:\/\/cad-kompass.de\/index.php?rest_route=\/wp\/v2\/posts\/2871\/revisions"}],"predecessor-version":[{"id":2882,"href":"https:\/\/cad-kompass.de\/index.php?rest_route=\/wp\/v2\/posts\/2871\/revisions\/2882"}],"wp:attachment":[{"href":"https:\/\/cad-kompass.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2871"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cad-kompass.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2871"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cad-kompass.de\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2871"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}