Gebäudeplaner

Interaktive Möblierungs- und Sitzplatzplanung · v9
Gesamt: 0 AP
Ansicht: Plan:
Zoom: 60%
— px/m
Output:
Projekt: — kein Projekt —
Layer:
Bedienung: Möbel ziehen = verschieben · Klick = +45° drehen · Shift+Mausrad = ±5° fein drehen · Strg+ziehen = Raster-Snap (10 cm) · Strg+Klick = markieren · Rechteck ziehen = mehrfach markieren · Esc = abwählen · Entf = löschen · Drucken/PDF: A4 pro Etage.
5-m-Lineal (Maßstab)

Neue Etage anlegen

Mit Plan: nach dem Anlegen öffnet sich der Kalibrier-Wizard.
Ohne Plan: leere Fläche, Kalibrierung kann später nachgeholt werden.

Etagen verwalten

Maßstab kalibrieren

Strecke: Pixel. Reale Distanz in Metern?

JSON exportieren — Auswahl

Wähle, welche Etagen und Layer im Export enthalten sein sollen. Plan-Layer enthalten Bilddaten und können den Export groß machen.

JSON importieren — Auswahl

— oder JSON-Text direkt einfügen —

Noch nichts geladen

PDF — Seite wählen

Mehrseitiges PDF: Wähle die Seite mit deinem Grundriss durch Klick auf das Vorschaubild.

Maßstab festlegen

Schritt 1/2: Klicke einen ersten Punkt an einer bekannten Maßlinie (z. B. eine Wand mit 5-m-Angabe).
Plan

Neuen Layer anlegen

Maße eingeben

⚡ Stromkreise —

Hierarchie: VerteilerFI-SchalterLS (Stromkreis) → Steckdosen. Klicke auf bei einem LS, um aktuell markierte Steckdosen zuzuweisen.

📜 Versions-Verlauf —

Jeder Save erzeugt eine neue Version. Benannte Versionen werden nicht auto-bereinigt; unbenannte werden auf die letzten 30 pro Projekt beschnitten. „Wiederherstellen" lädt diese Version als neue aktuelle.

⏪ Snapshot wiederherstellen

Snapshots werden automatisch vor destruktiven Aktionen (Layer-/Etage-Delete, JSON-Import, Plan-Wechsel, …) erzeugt.

📌 Benannte Snapshots

⟲ Auto-Snapshots (rolling, letzte 20)

📑 Audit-Log

— wird beim Öffnen gefüllt —





🔗 Public-Links — Admin-Übersicht

Alle Public-Share-Links instanzweit. Du siehst Projekt, Label, Ersteller, Erstell- und Ablaufdatum sowie Status. Aktive Links lassen sich hier von zentraler Stelle widerrufen.

🔐 Zwei-Faktor-Authentisierung

🔑 Passkeys / WebAuthn — Login per Touch ID, Windows Hello, Sicherheits-Token oder Smartphone (statt Passwort + TOTP):

🔔 Benachrichtigungen

Du wirst informiert, wenn dir ein Projekt freigegeben oder entzogen wird oder sich deine Rolle ändert. Aktualisierung bei Login + manuellem Refresh.

⚙ Admin-Panel — Benutzer-Verwaltung

Hier lädst du Benutzer ein und verwaltest Rollen, Passwörter und Aktiv-Status. Geteilte Projekte (Owner → Editor/Viewer) werden im Projekt-Switcher per 🤝-Knopf am jeweiligen Projekt verwaltet.

+ Neuen Benutzer einladen




Das Initial-Passwort wird unten in der Liste einmalig groß angezeigt — bitte sicher an den Empfänger weitergeben. Es ist nicht erneut abrufbar.

🖨️ Drucken / PDF — Optionen

Etagen:
 
Grundriss-Modus:


Wand-Ansicht:


Stromkreis-Tabelle:

→ PoE-Quelle zuweisen

→ Stromkreis zuweisen

Sitzplatzplanung — Projekt wählen

Wähle ein vorhandenes Projekt zum Öffnen, oder lege ein neues an.

Neues Projekt anlegen

Projekt speichern als …

Es ist aktuell kein Projekt aktiv. Gib einen Namen ein, um deine Arbeit als neues Projekt zu speichern.

🤝 Projekt teilen

Aktuelle Freigaben

— wird geladen —

User hinzufügen

🔗 Public-Links (read-only)

Jeder mit dem Link kann das Projekt schreibgeschützt öffnen — auch ohne Login. Der Token wird nur einmalig angezeigt; danach nur Widerrufen möglich.

🔐 Anmeldung

Bitte mit deinem Server-Account anmelden.

🔑 Passwort vergessen?

🔑 Passwort zurücksetzen

Trage deinen Benutzernamen oder deine hinterlegte E-Mail ein. Wir schicken dir einen Link zum Setzen eines neuen Passworts.

🔑 Neues Passwort setzen

— wird beim Öffnen befüllt —

🗎 DWG-Datei importieren

DWG ist Autodesks proprietäres Binärformat und kann nicht direkt im Browser gelesen werden. Du hast drei Wege — wähle was zu dir passt:

🖥️ Option 1 — Lokaler Konverter-Service

Ein kleiner Python-Service auf deinem Rechner konvertiert die DWG. Deine Datei verlässt den Rechner nicht.

Service-Status: prüfe…


🌐 Option 2 — Online-Konverter (kein Setup nötig)

Datei in einem Online-Service umwandeln, dann die zurückbekommene .dxf hier hochladen. Achtung: die Datei wird zu einem Drittanbieter hochgeladen.

Nach der Konvertierung: hier wieder „Plan ändern" klicken und die DXF-Datei auswählen.


💻 Option 3 — Im CAD-Programm selbst speichern

In deinem CAD-Tool die DWG öffnen → „Speichern unter…" → DXF wählen → diese DXF hier hochladen.

Funktioniert mit AutoCAD, BricsCAD, QCAD (kostenlos), LibreCAD (kostenlos), ZWCAD und allen anderen.

🧱 Grundriss-Erkennung — Review

— Linien erkannt · Klick auf eine Linie schaltet sie aus/ein · Schieberegler unten passen die Empfindlichkeit an.


Bereich: ganzes Bild

🎨 Frei definieren

Eigenes Möbel/Objekt mit Symbol, Maßen und Farbe anlegen. Optional als wiederverwendbare Vorlage in eine Sektion einsortieren.

(Überschreibt die Auswahl)
cm × cm

Gebäudeplaner — Hilfe

v9.x · Wiki: git.extoco.de/…/wikis/home

Was ist das?

Eine interaktive Webanwendung zur Möblierungs- und Sitzplatzplanung in Architekturplänen. Lade einen Grundriss, kalibriere den Maßstab, platziere Möbel und Gewerke per Drag & Drop. Mehrere Etagen, mehrere Projekte, alles offline im Browser.

In 6 Schritten loslegen

  1. Welcome-Dialog: „+ Neues Projekt" → Name vergeben → „Leer" wählen (oder ein Beispiel aus samples/ importieren).
  2. Toolbar Reihe 1: „+ Etage" → Name vergeben → Plan-Datei wählen (JPG/PNG/PDF/DXF/DWG).
  3. Bei JPG/PNG/PDF: Plan-Wizard öffnet sich → zwei Punkte auf bekannter Maßlinie klicken → reale Distanz in Metern → Übernehmen. Bei DXF: Maßstab wird automatisch aus der Datei gelesen.
  4. Linke Sidebar öffnen („MÖBEL"-Tab am linken Rand) → Möbel-Kategorie wählen → Button klicken → Möbel erscheint in der roten Spawn-Zone.
  5. Möbel mit der Maus an Zielposition ziehen. Klick = +45° drehen. Mehrere markieren mit Strg+Klick oder Rechteck-Auswahl.
  6. Toolbar: „💾 Speichern" → bleibt im Browser. Backup: „⬇ JSON-Export" als externe Datei.

Was kann das Programm?

  • Pläne aus JPG, PNG, PDF, DXF und DWG laden
  • Echte Maße (in Metern) durch Kalibrierung
  • ~160 Möbel-, Geräte- und Symbol-Typen in 16 Sektionen (inkl. Bar, Außen, Wände, Beleuchtung)
  • Mehrere Layer pro Etage (Möbel/Elektro/Heizung/Grundriss/etc.)
  • Strecken, Polylinien und Flächen messen
  • Wände aus dem Plan automatisch erkennen (Vanilla-JS-Bildverarbeitung)
  • Eigene Vorlagen speichern (Einzel-Items oder Gruppen)
  • A4-Druck, PNG-Export, selektiver JSON-Export, Standalone-HTML-Export

Toolbar-Reihen

Reihe 1 — Etagen: Etagen-Tabs (Klick = Wechsel) · „+ Etage" (Neu anlegen) · „⚙ Etagen" (verwalten) · AP-Gesamt-Counter

Reihe 2 — Plan: Zoom-Slider (20–120 %) · ppm-Anzeige · „📏 Kalibrieren" · „📐 Messen" (3 Modi) · „🧱 Grundriss erkennen" · „🗑️ Löschen" · „↺ Reset" (Etage)

Reihe 3 — Output: „🖨️ Drucken / PDF" (A4 pro Etage) · „📷 PNG (Etage)" · „⬇ JSON-Export" (selektiv) · „⬆ JSON-Import" · „📦 App+Projekte" (Standalone-HTML)

Reihe 4 — Projekt: „💾 Speichern" · „📂 Projekte" (umschalten/neu) · aktueller Projekt-Name · „❓ Hilfe"

Reihe 5 — Auswahl (erscheint nur bei Selektion): X ausgewählt · „💾 Als Vorlage" (Gruppen-Template)

Reihe 6 — Layer: Plan-Layer (🖼️) und Möbel-Layer als Pills. Klick aufs Auge togglet Sichtbarkeit, Klick auf den Punkt setzt aktiv, Doppelklick auf den Namen benennt um, X löscht.

Sidebar (linker Rand)

Roter „MÖBEL"-Tab am Bildschirm-Rand. Klick → einklappbares Akkordeon mit ~16 Sektionen (Arbeitsplätze, Möbel, Pflanzen, Küche, Elektrotechnik, Beleuchtung, EDV, Klima, Heizung, Sanitär, Sicherheit, Schilder, Bar & Theke, Wände & Öffnungen, Außen / Terrasse, Frei Definieren). „Arbeitsplätze" oben gepinnt, „Frei Definieren" unten gepinnt, dazwischen alphabetisch. Suche oben filtert live. Zustand der Sektionen + Sidebar-offen wird gespeichert.

Spawn-Zone (rotes Rechteck)

Zeigt, wo neue Möbel platziert werden. Per Drag an der roten Beschriftung verschiebbar. Klicks IN der Zone gehen zu Möbeln darunter durch — die Zone blockiert nichts. Pro Etage wird die letzte Position gespeichert.

Layer-System

Jede Etage hat eigene Layer. Plan-Layer = Hintergrund-Bild (kann mehrere geben). Möbel-Layer = einzelne Ebenen mit Möbeln/Symbolen. Aktiver Layer = wo neue Möbel landen. Beim Erkennen oder DXF-Import wird automatisch ein Layer „Grundriss" angelegt.

Unterstützte Plan-Formate

FormatVerarbeitungMaßstab
JPG / PNGdirektmanuell per 2-Punkt-Wizard
PDFvia inline PDF.js → erste Seite (oder Wahl) als PNGmanuell
DXFVanilla-JS-Parser (LINE/LWPOLYLINE/CIRCLE/ARC); wird auf Canvas gerendert UND als Wand-Items angelegtautomatisch aus $INSUNITS-Header (mm/cm/m/in/ft)
DWGdrei Wege zur Wahl: lokaler Service, Online-Konverter, manuell als DXF speichernnach Konvertierung wie DXF

Plan-Wizard (für JPG/PNG/PDF)

Nach Upload: großes Modal mit dem Plan und Zoom/Scroll. Zwei Punkte auf einer bekannten Maßlinie anklicken (z.B. Außenwand mit Maßangabe „24,42 m"). Reale Distanz eintragen → Übernehmen. Tipp: lange Strecken für höhere Genauigkeit. Nachträglich änderbar via „📏 Kalibrieren".

DXF-Import — Details

Der eingebaute Parser liest direkte Linien-Entitäten. Die Modell-Bounding-Box wird auf 1800 px Breite skaliert; der so entstehende „Plan-Bild" wird als Plan-Layer gesetzt. Parallel landen alle Linien als wall-line-Items in einem neu angelegten Layer „Grundriss".

  • Unterstützt: LINE, LWPOLYLINE, CIRCLE, ARC
  • Nicht (vollständig) unterstützt: POLYLINE-VERTEX-Paare (alter Format), SPLINE, HATCH, INSERT (Blocks werden nicht expandiert), TEXT/MTEXT
  • Wenn DXF-Header keine Einheit liefert: Maßstab muss manuell kalibriert werden

DWG-Import — Wege

Beim DWG-Upload öffnet sich ein Auswahl-Dialog:

  • Lokaler Service: Python-Service auf deinem Rechner ruft ODA File Converter auf. Datenschutzfreundlich, aber Setup nötig. Details im Tab „🗎 DWG-Service".
  • Online-Konverter: Direktlinks zu kostenlosen Diensten (CloudConvert, Convertio, Aspose, AnyConv). Datei verlässt deinen Rechner.
  • Manuell: In deinem CAD-Programm (AutoCAD, BricsCAD, QCAD, LibreCAD, …) „Speichern unter…" → DXF wählen → diese DXF dann hier hochladen.

Du musst nichts installieren, wenn du Online- oder CAD-Konvertierung nutzt.

Lokaler DWG-Konverter-Service einrichten

Der Service läuft auf 127.0.0.1:8765, nimmt DWG entgegen, ruft den ODA File Converter auf und gibt DXF zurück. Daten bleiben auf deinem Rechner.

🪟 Windows — Anleitung

  1. Python 3 installieren
  2. ODA File Converter installieren (kostenlos)
  3. Service starten — PowerShell oder CMD öffnen, Ordner wechseln:
    cd C:\…\gebaeudeplaner\helper
    python dwg_converter_service.py
    Erfolgs-Output sollte beginnen mit „ODA Pfad: C:\Program Files\ODA\…\ODAFileConverter.exe".
  4. Fenster offen lassen während du DWG-Dateien importierst.

Falls ODA in nicht-Standard-Pfad: vor dem Start setzen:

set ODA_PATH=C:\Pfad\zu\ODAFileConverter.exe
python dwg_converter_service.py

🐧 Linux — Anleitung

  1. Python 3 ist meist schon installiert. Prüfen: python3 --version. Falls nicht: sudo apt install python3 (Debian/Ubuntu) bzw. sudo pacman -S python (Arch/Manjaro).
  2. ODA File Converter installieren:
    • Download: opendesign.com/guestfiles/oda_file_converter (Linux x64 .deb oder .rpm)
    • Debian/Ubuntu: sudo dpkg -i ODAFileConverter_*.deb && sudo apt --fix-broken install
    • Arch/Manjaro: aus dem AUR (yay -S oda-file-converter) oder die .rpm mit alien umpacken
    • Fedora/RHEL: sudo dnf install ./ODAFileConverter_*.rpm
  3. Qt-Bibliothek nachziehen falls Fehler: sudo apt install libqt5gui5 bzw. sudo pacman -S qt5-base
  4. Service starten:
    cd ~/…/gebaeudeplaner/helper
    python3 dwg_converter_service.py
  5. Fenster/Terminal offen lassen während Konvertierungen.

🍏 macOS — Anleitung

  1. Python 3 installieren: brew install python (mit Homebrew) oder vom python.org-Installer
  2. ODA File Converter: opendesign.com/guestfiles/oda_file_converter → macOS-Build → .dmg-Datei öffnen und nach /Applications ziehen
  3. Im Terminal:
    cd ~/…/gebaeudeplaner/helper
    python3 dwg_converter_service.py

Test ob alles läuft

Im Browser http://127.0.0.1:8765/ping aufrufen — sollte JSON liefern mit "oda_found": true.

Sicherheits-Hinweis

Service lauscht nur auf 127.0.0.1 (nicht im LAN sichtbar). Theoretisch könnte jede lokal laufende App den Service ansprechen. Wenn nicht in Verwendung: Fenster schließen, Service stoppt mit Strg+C.

Alternativen (kein Setup nötig)

  • Online-Konverter — Links direkt im DWG-Upload-Dialog. CloudConvert, Convertio, Aspose, AnyConv. Datei wird zu Drittanbieter hochgeladen.
  • CAD-Tool — AutoCAD/BricsCAD/QCAD/LibreCAD: „Speichern unter" → DXF → diese DXF hier hochladen.

📐 Messen — 3 Modi

Toolbar → „📐 Messen". Im Hint-Banner erscheinen drei Pillen:

  • Strecke (Standard): 2 Klicks → gerade Linie → Confirm „X,XX m — speichern?"
  • Polylinie: beliebig viele Klicks → Doppelklick beendet → Gesamtlänge in m
  • Fläche: Polygon-Klicks → Doppelklick schließt → Fläche in m² (Shoelace-Formel)

Bei „OK" werden Annotationen auf den aktiven Layer abgelegt. Sie sind danach normale Items: drehbar, verschiebbar, löschbar, im PNG-Export sichtbar. Esc beendet den Modus.

🧱 Grundriss-Erkennung

Toolbar → „🧱 Grundriss erkennen". Analyse-Pipeline (Vanilla JS):

  1. Plan-Bild wird auf max 800 px Breite herunterskaliert (Performance)
  2. Grayscale-Konversion + Adaptive Threshold
  3. Sobel-Gradient → Edge-Map
  4. Hough-Transform → Polar-Linien
  5. Linien-zu-Segmente entlang der Edges + Cluster ähnlicher Linien

Im Review-Dialog:

  • Schieberegler: Empfindlichkeit (Threshold) und Min-Linienlänge → „⟳ Neu berechnen"
  • Bereichswahl: „🔲 Bereich zeichnen" → Rechteck auf dem Plan ziehen → Erkennung läuft nur darin (Schnittansichten und Schriftblöcke ausblenden)
  • Klick auf eine Linie: aktiv (grün) / deaktiviert (grau-gestrichelt)
  • Ziel-Layer: bestehender „Grundriss" oder neu anlegen
  • Wand-Stärke: in cm einstellbar (Default 12 cm = Trockenbau)
  • Beim Übernehmen: Plan-Layer kann optional ausgeblendet werden

Qualität: sehr gut bei CAD-PDF-Exporten, mittel bei gescannten/handgezeichneten Plänen. Für Türen/Fenster (Bogen-Symbole) noch nicht implementiert.

Möbel platzieren

Sidebar → Sektion wählen → Button klicken → Möbel erscheint in Spawn-Zone der aktuellen Etage und im aktiven Layer.

Bei vielen Möbel-Typen öffnet sich erst ein Maß-Dialog mit Quick-Picks (z.B. Unterschrank: 40/50/60/80/100/120 cm Breite). Bei manchen auch Farb-Auswahl.

Mehrfach-Auswahl

  • Strg+Klick oder Shift+Klick: Möbel zur Auswahl togglen
  • Rechteck-Auswahl: Maus auf leerer Fläche ziehen → Marquee
  • Alle markierten zusammen ziehen / drehen / löschen
  • Reihe „Auswahl" in der Toolbar zeigt Anzahl + bietet „💾 Als Vorlage"

🎨 Frei Definieren

Sidebar → Sektion „Frei Definieren" → „🎨 Neues freies Objekt…"

Im Dialog:

  • Symbol-Picker (27 Vorlagen) oder eigenes Emoji/Text eintippen
  • Maße in cm, Farbe, Label
  • Checkbox „Als Vorlage speichern" → Name + Ziel-Sektion wählen → das Möbel erscheint dauerhaft in der gewählten Sidebar-Sektion mit ★-Markierung

Vorlagen aus Mehrfach-Auswahl

Mehrere Möbel auswählen → Toolbar „💾 Als Vorlage" → Name eingeben. Die Vorlage erscheint in der Sektion „Eigene Vorlagen". Klick spawnt alle enthaltenen Möbel zusammen in der Spawn-Zone (relative Anordnung bleibt). ✕ am Vorlagen-Button löscht.

Maßstab + Rotation

  • Klick auf Möbel = +45° Drehung
  • Shift + Mausrad über Möbel = ±5° Fein-Rotation
  • Strg + ziehen = Raster-Snap auf 10-cm-Gitter

Stromkreis-Planung — die Idee

Du planst die elektrische Infrastruktur in drei Ebenen:

  1. Verteiler (Unter­verteilung, Sicherungs­schrank) — z.B. „UV-EG"
  2. FI-Schalter (Fehler­strom­schutz, üblich 30 mA) — eine Schutz­gruppe pro Verteiler
  3. LS-Schalter (Leitungs­schutz, einzelner Stromkreis) — z.B. „B16" (Charakteristik B, 16 A)

Steckdosen werden einem LS zugeordnet. Damit weißt du jederzeit, welche Steckdose an welcher Sicherung hängt und welcher FI sie schützt.

Workflow

  1. Steckdosen ganz normal auf dem Plan setzen (Sidebar → Elektrotechnik).
  2. Toolbar Reihe 4: „⚡ Stromkreise" → öffnet den Verteiler-Dialog.
  3. „+ Verteiler" für jede Unterverteilung anlegen (Name editierbar). Optional „🔗 Item" → mit einem Sicherungs­schrank-Item auf dem Plan verknüpfen.
  4. Pro Verteiler „+ FI" hinzufügen (Auslöse­strom in mA setzbar).
  5. Pro FI „+ LS" hinzufügen — jedes LS ist ein Stromkreis. Charakteristik (B/C/K) und Nennstrom (A) wählen.
  6. Steckdosen auf dem Plan markieren (Rechteck-Auswahl oder Strg-/Shift-Klick).
  7. Im Dialog hinter dem Ziel-LS auf „" klicken — alle markierten Steckdosen werden zugeordnet. (Alternative: Auswahl-Reihe → „→ Stromkreis" für Liste.)

Visualisierung

  • Jedem LS wird automatisch eine eindeutige Farbe aus einer Palette zugewiesen.
  • Zugeordnete Steckdosen bekommen einen dezenten Farbring (Box-Shadow) in der LS-Farbe.
  • Im Dialog: „👁" hinter einem LS lässt seine Steckdosen kurz pulsieren — schnelle Sicht­kontrolle.
  • Checkbox „⚠ unzugeordnete Steckdosen markieren" im Dialog: ungebundene Steckdosen bekommen ein gelbes ⚠.

Was stromkreis­fähig ist

Alle Items mit hinterlegter Stromlast sind einem LS zuweisbar (markieren → „→ Stromkreis"):

  • Steckdosen: Schuko (single + double), Außen-Schuko, Wallbox
  • Leuchten: komplette Sektion (intern + außen, inkl. LED-Leisten, Lichtbänder, Pendel, Poller, Strahler)
  • Küchen­geräte: Kühlschrank, Spül­maschine, Herd, Backofen, Mikrowelle, Wasser­kocher, Kaffee­maschine, Kaffee­station, Dunst­abzug, Warm­wasser­speicher
  • EDV / AV: Switch, Server-Rack, Beamer, TV 50"/82"/100". WLAN-AP, IP-Kamera und IP-Telefon sind PoE-Verbraucher — siehe Abschnitt „PoE-Auslastung" weiter unten.
  • Klima: AC-Decke/Wand/Boden (Innengerät — Außen­einheit ist gemeinsam abgerechnet)
  • Heizung/Lüftung: Gas-Kessel, Wärmepumpe-Innen, Lüfter, Hebeanlage
  • Sanitär: Hand­trockner, Trink­wasser­spender
  • Sicherheit: Notlicht, Rettungs­schilder
  • Außen: Pumpe, Brunnen­pumpe

Nicht stromkreis­fähig (Möbel, passive Schränke, Sensorik mit Batterie, Daten-/EDV-Dosen, Glasfaser, Antenne, HDMI, Schalter, FI/LS-Item) — keine Last, kein Eintrag im Dialog.

Last-Schätzung pro Stromkreis

Im Dialog zeigt jeder LS eine farbige Last-Pille: aktuell W / max W

  • Annahme-Beispiele: Schuko 200 W · Wallbox 11 000 W · Herd 7500 W · Spül­maschine 2000 W · Kühl­schrank 150 W · Mikrowelle 1500 W · Kaffee­station 1500 W · Switch 250 W (PoE-Budget inkl. APs/Kameras) · Server-Rack 1500 W · AC-Innen 1200–1500 W · Beamer 300 W · TV 50"/82"/100" = 150/250/400 W · Hand­trockner 1500 W · LED-Beleuchtung 10–80 W.
  • Maximal-Last = Nennstrom × 230 V × 0,6 (60 % Derating laut DIN/VDE-Empfehlung).
  • Farbcode: grün <60 % Auslastung, gelb 60–80 %, rot ≥80 %.
  • Die Annahmen sind eine grobe Plausibilitäts­hilfe — die Belastungs­berechnung beim Elektriker bleibt maßgeblich.

Export für Elektriker-Übergabe

Im Stromkreis-Dialog oben rechts:

  • 📋 Export (.md) — Markdown mit Tabelle aller Stromkreise und Liste unzugeordneter Steckdosen. Lesbar in Mail/Druck.
  • 📊 CSV — Excel-DE-kompatibel (Semikolon-Trenner, UTF-8-BOM). Direkt in Excel/LibreOffice importierbar.

Doppelte zählen doppelt

Doppel­steckdosen (socket-double, data-socket-double) zählen bei der Stockwerks- und Stromkreis-Zählung als 2 Dosen. Glasfaser und einfache LAN/Antenne/HDMI zählen als 1.

Tab-Counter

Jeder Etagen-Tab zeigt zusätzlich zur AP-Zahl die Elektro-Bilanz:

  • 🔌 = Strom-Steckdosen (Doppel = 2)
  • 🌐 = Netzwerk-/EDV-Dosen + Glasfaser (Doppel = 2)
  • 💡 = Leuchten / Leuchtstellen (jede Leuchte = 1)

PoE-Auslastung pro Switch (v9.34)

Statt pauschal 250 W pro Switch wird die Last dynamisch berechnet:

  • Switch-Basisverbrauch: 50 W (Eigenverbrauch ohne PoE)
  • + PoE-Verbrauch je Gerät: WLAN-AP 15 W, IP-Kamera 8 W, IP-Telefon 5 W
  • PoE-Budget pro Switch: 240 W (typischer 24-Port-PoE+-Switch)

Workflow: PoE-Geräte markieren → Auswahl-Reihe → „→ PoE-Quelle" → Switch wählen. Dialog zeigt aktuelle Auslastung pro Switch (grün/gelb/rot wie bei Stromkreisen). Im Stromkreis-Dialog gibt es eine 📡 PoE-Übersicht am Ende mit allen Switches und ihren Budget-Werten plus Warnung bei verwaisten PoE-Geräten.

Der Stromkreis (LS), an dem der Switch hängt, bekommt die effektive Switch-Last (50 W + PoE-Summe), nicht mehr die alte Pauschale.

Was die Stromkreise nicht tun (bewusst)

  • Es gibt keine automatische Lastberechnung. Anzahl Steckdosen pro LS ist sichtbar — die Lastannahme (z.B. „Büro ~ 200 W/Dose") bleibt deine Entscheidung.
  • Es werden keine Kabel geroutet. Der Plan dient der Zuordnung, nicht der Trassen-Planung.
  • Die Stromkreis-Struktur wird mit dem Projekt gespeichert (Standalone: IndexedDB, Server: Datenbank) und in JSON-Exports übernommen.

Zwei Ansichten — Grundriss + Seitenriss

Die Anwendung hat zwei Modi, umschaltbar in Toolbar Reihe 2 → Ansicht:

  • 🗺️ Grundriss (Default): Klassische Top-Down-Sicht auf den Etagenplan.
  • 🧱 Wand-Ansicht: Seitenriss — alle wand­montierten Elemente (Steckdosen, Schalter, Leuchten, Detektoren, Schilder, …) werden auf ihrer Montagehöhe dargestellt. Boden und Decke sind als Linien sichtbar, dazwischen Hilfslinien alle 50 cm.

Wozu?

Sanity-Check vor Elektro-Termin: Sind alle Schuko-Dosen wirklich auf 30 cm? Sitzt der Schalter neben der Tür auf 105 cm? Hängt die Pendelleuchte auf 200 cm? Solche Inkonsistenzen sieht man im Seitenriss in einer Sekunde, im Grundriss gar nicht.

Montagehöhe (z_cm)

  • Jedes Item hat eine Montagehöhe z_cm über OK Fertigfußboden.
  • Defaults aus der Praxis (DIN 18015 / Erfahrungswerte): Schuko 30 · Schalter 105 · Thermostat 150 · Doppel­schuko über Schreibtisch typisch 110 (manuell setzen) · Feuerlöscher 110 · Erste-Hilfe-Kasten 150 · Rauch­melder 270 · Decken­leuchten 270 · Pendel 200–220 · Wand­leuchte 180 · Schreibtisch­lampe 75 · Fenster (Brüstung) 90.
  • Doppelklick auf ein Item im Seitenriss → Eingabe „Montagehöhe in cm". Wird im State gespeichert. Default greift, solange du nicht manuell überschreibst.

Raumhöhe

Default 300 cm. Button „📐 Raumhöhe" in der Ansicht-Toolbar (nur im Wand-Modus sichtbar) → Eingabe in cm (200–600). Wird pro Etage gespeichert (`floor.roomHeightCm`).

Wand-Filter (v9.35)

Im Wand-Modus erscheint eine Dropdown-Liste mit allen Wand-Items der Etage. Eine Wand wählen filtert auf Items im Umkreis von 80 cm dieser Wand und projiziert sie auf deren Achse. So bekommt man eine echte „Schnitt-Ansicht" einer einzelnen Wand.

  • „— alle Items projiziert —": Default, zeigt alle wand­montierten Items auf globaler X-Achse (wie vorher v9.29)
  • Wand X (length · angle): Filter aktiv, nur Items entlang dieser Wand werden gezeigt

Was die Wand-Ansicht nicht ist

  • Kein 3D: es ist ein 2D-Seitenriss — Items sind nicht räumlich, sondern in ihrer Höhe markiert.
  • PNG-Export verwendet derzeit immer den Grundriss-Modus. Wand-Ansicht kann gedruckt werden (siehe Print-Optionen).

Maus & Tastatur

AktionWirkung
Möbel ziehenVerschieben (bei Multi-Select: alle zusammen)
Möbel klicken+45° drehen (bei Multi-Select: alle zusammen)
Shift + Mausrad über MöbelFein-Rotation ±5°
Strg + ziehenRaster-Snap (10-cm-Gitter)
Strg/Cmd + KlickMöbel zur Auswahl togglen
Shift + KlickAdditiv zur Auswahl
Maus auf leerer Fläche ziehenRechteck-Auswahl (Marquee)
EscAuswahl aufheben / Modus beenden / Dialog schließen
Entf / BackspaceMarkierte Möbel löschen (Confirm)
Doppelklick (im Mess-Modus)Polylinie/Fläche abschließen

Standalone vs. Server

Die App existiert in zwei Varianten aus derselben Codebasis:

StandaloneServer
SpeicherungIndexedDB im BrowserSQLite auf dem Server
LoginUser + Passwort (Session-Cookie)
Multi-UserOwner / Editor / Viewer pro Projekt
Offline
Geräte-übergreifendJSON-Export/Importautomatisch
Konflikt-HandlingOptimistic-Lock, Konflikt-Dialog

Server aufsetzen (Linux, kurz)

cd backend/
python3 -m venv .venv
source .venv/bin/activate
pip install -r requirements.txt
python3 ../scripts/build_html.py --mode server
python3 setup_admin.py
uvicorn main:app --host 127.0.0.1 --port 8000

Produktiv-Setup mit systemd, Caddy/nginx-Proxy, Backup-Cron: siehe backend/README.md im Repo. Vorlagen: backend/gebaeudeplaner.service.template, backend/Caddyfile.template.

Sharing (nur Server-Modus)

Im Projekt-Switcher („📂 Projekte") hat jedes Projekt, dessen Owner du bist, einen 🤝-Knopf. Klick öffnet den Sharing-Dialog:

  • Aktuelle Freigaben mit Rolle (Viewer/Editor) — Rolle per Dropdown ändern, ✕ zum Entfernen
  • User hinzufügen: aus Dropdown wählen, Rolle setzen, „+ Hinzufügen"

Geteilte Projekte tauchen beim Empfänger automatisch in seiner Projekt-Liste auf — mit Markierung „geteilt von <owner>".

Welche Variante läuft hier gerade?

— wird beim Öffnen befüllt —

Setup: pro Firma eine Instanz

Pro Firma läuft ein eigener Server (FastAPI + SQLite). Auf dieser Instanz arbeiten beliebig viele Benutzer (interne Kollegen, externe Partner wie Architekten / Elektriker / Bauleiter) auf mehreren Bauprojekten parallel.

⚙ Admin-Panel (v9.37+)

Sichtbar nur für Rolle admin in Toolbar Reihe 4:

  • + Neuen Benutzer einladen: Username + 🎲-Zufalls-Passwort (14 Zeichen) + Rolle (user/admin)
  • Erzeugtes Passwort wird einmalig in der Tabelle in Monospace angezeigt — sicher an den Empfänger weitergeben
  • Pro User: 🔑 Passwort zurücksetzen · Rolle ändern (Dropdown) · Aktiv togglen · 🗑 löschen
  • Self-Lock: du kannst dich nicht selbst herabstufen, deaktivieren oder löschen, wenn du der letzte aktive Admin bist (Backend wirft 400)
  • User mit eigenen Projekten lassen sich nicht löschen (409) — Eigentum erst übertragen oder Projekte selbst löschen

Projekt-Sharing (v9.18+)

Wer ein Projekt anlegt, wird automatisch dessen Owner („Master"). Im Projekt-Switcher hat jedes eigene Projekt einen 🤝-Knopf:

  • Editor: darf Inhalt ändern + speichern
  • Viewer: nur lesen
  • Rolle live per Dropdown ändern, ✕ entfernt den Zugriff

Geteilte Projekte erscheinen beim Empfänger automatisch im Projekt-Switcher mit „geteilt von <Owner>". Bei gleichzeitigen Edits sorgt der Konflikt-Dialog dafür, dass Änderungen nicht überschrieben werden (Optimistic-Lock).

Möbel-Vorlagen zentral (v9.38+)

Im Server-Modus liegen Vorlagen zentral auf dem Server statt browser-lokal:

  • Beim Speichern fragt das System: „Soll diese Vorlage geteilt werden?"
  • Privat: nur du siehst sie · Geteilt: alle Benutzer der Instanz sehen sie
  • Eigene shared Vorlagen tragen ein 🌐, fremde shared ein 👤 mit „(von <Owner>)"
  • Löschen darf nur der Owner — bei fremden Vorlagen ist das ✕ ausgeblendet
  • Sichtbarkeit nachträglich änderbar: toggleTemplateVisibility(id) (im Code; UI-Toggle kann ergänzt werden)

Beispiel-Workflow: externen Elektriker einbinden

  1. Admin: ⚙ Admin → User wimmer-elektro anlegen, Rolle user, Zufalls-Passwort generieren, weitergeben
  2. Owner des betroffenen Projekts: Projekt-Switcher → 🤝 → User wählen → Rolle „Editor"
  3. Elektriker meldet sich an, sieht das Projekt, kann Stromkreise/Steckdosen direkt im Plan zuordnen
  4. Nach Abschluss: Admin → wimmer-elektro deaktivieren oder löschen (falls keine eigenen Projekte)

📜 Versionen (v9.39+)

Jedes Speichern legt automatisch eine Version an. Über 📜 Versionen in der Toolbar:

  • Versionen benennen (z.B. „Vor Ortstermin Wimmer") — benannte Versionen werden nie automatisch gelöscht; unbenannte werden auf die letzten 30 pro Projekt beschnitten
  • ↩ Wiederherstellen: setzt die aktuelle Version auf den Stand einer alten Version (der bisherige Stand wird vorher als neue Version gesichert)
  • 🔍 Diff (v9.50): zwei Versionen aus den Dropdowns wählen → Liste der hinzugefügten / entfernten / geänderten Items mit Feld-Diff (vorher → nachher)

📑 Audit-Log (v9.40+)

Über 📑 Audit sichtbar. Wer hat wann was getan: Logins, Projekt-Saves, Sharing-Änderungen, User-Edits. Admin sieht alle Events der Instanz, normale User nur ihre eigenen. Filter nach Aktion, Ziel-Typ, Ziel-ID. CSV-Export für Excel (v9.44+).

⭐ Project-Templates (v9.47+)

Im Projekt-Switcher hat jedes eigene Projekt einen ⭐/☆-Knopf. Wer markiert macht es zur Vorlage:

  • Vorlagen sind für alle Benutzer der Instanz read-only sichtbar
  • Beim Anlegen eines neuen Projekts erscheint die Option „⭐ Aus Vorlage klonen" mit Dropdown
  • Geklont werden alle Etagen, Layer, Items und Pläne — das Original bleibt unverändert

🔔 Benachrichtigungen (v9.48+)

In der Toolbar erscheint 🔔 Inbox mit Anzahl ungelesener Nachrichten. Ausgelöst durch:

  • share: jemand hat dich zu einem Projekt eingeladen
  • role_changed: deine Rolle wurde geändert (z.B. von Viewer auf Editor)
  • unshare: dein Zugriff wurde entzogen

Aktualisierung erfolgt beim Login + manuellem Refresh (kein Polling).

🔗 Public-Links (read-only, v9.49+)

Wer ein Projekt mit Externen ohne Login teilen will: im Sharing-Dialog Sektion 🔗 Public-Links:

  • Label (optional) + Ablauf-Dauer (7 / 30 / 90 Tage oder unbefristet) → „+ Link erzeugen"
  • Der vollständige Token wird nur einmal angezeigt — sofort kopieren und an den Empfänger
  • Empfänger öffnet die URL ?public=… und sieht das Projekt schreibgeschützt mit Banner
  • Aktive Links lassen sich jederzeit widerrufen (✕) — sind dann sofort ungültig

🔐 2FA / TOTP (v9.51+)

Optional pro User. Toolbar-Knopf 🔐 2FA:

  1. „+ 2FA jetzt einrichten" → Server zeigt Base32-Secret + otpauth-URI einmalig an
  2. Secret in einer Authenticator-App scannen oder eintippen (Aegis, Google Authenticator, …)
  3. Aktuellen 6-stelligen Code zur Bestätigung eingeben → 2FA ist aktiv
  4. Beim nächsten Login wird zusätzlich der Code abgefragt; das Feld blendet der Login-Dialog automatisch ein
  5. Deaktivieren verlangt Eingabe des Passworts, damit kein fremder Sessionhopper das abschalten kann

📋 2FA-Backup-Codes (v9.52+)

Notfall-Codes für den Fall, dass das Phone weg ist. Im 2FA-Dialog (nur wenn 2FA aktiv) gibt es Sektion 📋 Backup-Codes:

  • „🔁 10 neue Codes erzeugen" generiert sie einmalig — danach kopieren oder 🖨 drucken und sicher ablegen (z.B. Passwortmanager, ausgedruckt im Tresor)
  • Jeder Code lässt sich genau einmal beim Login eingeben (statt des 6-stelligen TOTP-Codes); danach ist er verbraucht
  • Status-Anzeige im Dialog: „N von 10 Codes übrig" — bei < 3 wird gewarnt
  • Neuerzeugen invalidiert alle bisherigen Codes; sicher gegen aus alten Backups

🔑 Passkeys / WebAuthn (v9.60+)

Passwortloser Login per Touch ID, Windows Hello, Sicherheits-Token (YubiKey, Solo) oder Smartphone-Passkey. Pflicht-Voraussetzung: HTTPS-Verbindung.

  • 2FA-Dialog → Sektion 🔑 Passkeys → „+ Passkey registrieren" → Browser fragt nach Authenticator
  • Beim nächsten Login: Benutzername eintippen, dann 🔑 Passkey-Button → Browser fragt nach Touch/Klick auf den Schlüssel — kein Passwort, kein TOTP
  • Mehrere Passkeys pro User möglich (z.B. „MacBook Touch ID" + „YubiKey" + „iPhone")
  • Liste mit Labels + letzter Verwendung; Löschen jederzeit möglich
  • Funktioniert parallel zu Passwort+TOTP — wer kein Passkey hat, loggt sich wie gewohnt ein

🔗 Public-Link-Admin-Übersicht (v9.53+)

Toolbar-Button 🔗 Links (nur Admin) öffnet eine instanzweite Tabelle aller Public-Share-Links — egal welches Projekt. Pro Eintrag: Projekt, Label, Ersteller, Erstell-/Ablaufdatum, Status (aktiv/widerrufen/abgelaufen). Aktive Links lassen sich zentral widerrufen — wichtig für Audit oder wenn der Owner nicht erreichbar.

📦 Möbel-Kompositionen (v9.55+)

Vorgefertigte Multi-Item-Vorlagen mit 📦-Badge im Möbel-Akkordeon:

  • 4er-Bench mit Trennwand, 6er-Bench mit Trennwand (Arbeitsplätze)
  • Besprechung 6 Plätze + TV (Tisch + 6 Stühle + Display als ein Klick)
  • Phonebox-Paar (2× Framery One)
  • Server-Rack-Set (Server + USV + Patchpanel im EDV-Bereich)

Klick platziert alle Items relativ zum Origin; danach lassen sie sich gemeinsam selektieren + verschieben. Eigene Vorlagen über 💾 Als Vorlage aus der Auswahl-Leiste — landen daneben.

📏 Mess-Werkzeug (v9.56+)

Mess-Modus per 📐 Messen-Button. Drei Sub-Modi:

  • Strecke: 2 Klicks → Distanz; Live-Vorschau zeichnet vom letzten Punkt eine gestrichelte Linie zum Cursor mit Wert
  • Polylinie: Klicks beliebig, Doppelklick beendet → Gesamtlänge
  • Fläche: Klicks rundum, Doppelklick schließt → m²

Doppelklick auf eine bestehende Mess-Annotation öffnet einen Prompt zum Editieren der Beschriftung (z.B. „Wandbreite Verwaltung — 5,01 m"). Print-Dialog hat Checkbox „Mess-Liste" für eine Tabellenseite pro Etage.

🖼 Versionen-Diff visuell (v9.59+)

Im Versionen-Dialog nach Auswahl zweier Versionen und Klick 🔍 Diff erscheint ein 🖼 Im Plan markieren-Button im Header des Diff-Ergebnisses. Schließt den Dialog und zeichnet farbige Marker direkt über die Items des aktuellen Stockwerks:

  • + grün = neu in v_b
  • − rot = nur in v_a, in v_b entfernt
  • ~ gelb = in beiden, Felder unterschiedlich (Position, Größe, Label…)

Banner oben rechts mit Reset-Knopf; Etagenwechsel verwirft Markierungen automatisch.

📱 PWA / App-Installation (v9.58+)

Im Server-Mode lässt sich der Gebäudeplaner als Installierbare App betreiben:

  • Chrome/Edge auf Desktop: Menü → Installieren … oder Adressleisten-Icon
  • Mobile Browser: „Zum Startbildschirm hinzufügen"
  • Funktioniert nur über HTTPS (oder localhost)
  • App-Shell wird gecached, nach einmaligem Laden auch offline öffenbar (Login schlägt dann aber fehl bis Netz wieder da)

💾 Geo-Backup (v9.57+)

Admin-Hinweis: `backup.sh` schiebt jeden lokalen Snapshot zusätzlich via `rclone` in einen Cloud-Speicher (S3, B2, Hetzner Storage Box, Google Drive). Konfiguration über Env-Var `GEBAEUDEPLANER_REMOTE`. Details in `backend/README.md`.

🟢 Online-Anzeige (v9.43+)

Wer gerade am selben Projekt arbeitet, taucht als 🟢 N Benutzer aktiv-Badge neben dem Projektnamen auf (Mouseover: Liste). Polling alle 30 Sekunden; Einträge älter als 60 s gelten als offline.

🔑 Passwort vergessen (v9.42+)

Auf der Login-Seite Link „🔑 Passwort vergessen?" → Benutzername oder E-Mail eintragen → System schickt Reset-Mail (sofern SMTP konfiguriert). One-shot-Link, 1 Stunde gültig.

Wo werden meine Daten gespeichert?

Alles läuft lokal im Browser. Speicher: IndexedDB (kein 5 MB-Limit wie bei localStorage, ca. 50 % der freien Festplatte verfügbar). Kein Server, keine Cloud, kein Account.

Mehrere Projekte: parallel im selben Browser. „📂 Projekte"-Dialog zum Wechseln, Anlegen, Umbenennen, Löschen.

Backup & Transfer

  • ⬇ JSON-Export: selektiver Export (Etagen/Layer per Checkbox). Datei lässt sich auf einem anderen Rechner per ⬆ JSON-Import wieder einlesen (Modus „Hinzufügen" oder „Ersetzen").
  • 📦 App+Projekte: exportiert App + alle Projekte als eine HTML-Datei. Empfänger öffnet sie → die enthaltenen Projekte werden angeboten zu übernehmen. Ideal zum Weitergeben an Mitarbeiter ohne Setup.

Wann gehen Daten verloren?

  • Browser-Cache komplett gelöscht (Inkl. „Site-Daten" / „IndexedDB")
  • Inkognito-/Privatfenster (IndexedDB wird beim Schließen geleert)
  • Browser-Update kann selten zu Quota-Reset führen

Tipp: regelmäßig „⬇ JSON-Export" oder „📦 App+Projekte" als Backup ablegen.

Quota voll?

Wenn der Browser keinen Platz mehr hat, erscheint ein roter Banner. Lösung: ältere Projekte löschen (mit JSON-Export-Backup vorher) oder andere Site-Daten freiräumen.

Eigenschaften