Add three-floor townhouse example with plan/model view toggle#62
Merged
Conversation
Adds a new example modelling a 20'x32' three-story townhouse (Ground / Main / Upper) at stacked elevations using OpenPlans walls, doors, and windows. The ground floor includes a garage with a south-facing door opening, an office, and a bathroom; the main floor has a family room, kitchen, dining, and stair zone; the upper floor has a master suite and second bedroom with private baths and wardrobes. The example wires the existing CameraMode plus per-element profileView/modelView toggles so the user can switch between top-down plan view and full 3D model view.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR adds a new comprehensive example demonstrating a three-floor townhouse (Ground / Main / Upper) modeled with OpenPlans walls, doors, and windows. The example includes an interactive UI that allows toggling between a plan-style top-down profile view and a full 3D model view, showcasing the library's ability to render both 2D floor plans and 3D architectural models.
The townhouse is 20'×32' with realistic room layouts:
The example also includes a polished UI with a hero panel, control buttons, and a legend explaining the floor structure.
Changes
examples/src/three-floor-townhouse.html (new): Complete interactive example with:
examples/src/index.html (modified): Added featured card linking to the new three-floor townhouse example
Verification
The example can be viewed by opening
examples/src/three-floor-townhouse.htmlin a browser. The interactive controls allow:Docs And Examples
Updated the examples index to feature the new three-floor townhouse example as a showcase of the library's capabilities for both 2D and 3D architectural visualization.
Reviewer Notes
Checklist
dist/orexamples/dist/https://claude.ai/code/session_01Th3SP4MoWEWd9g3reEcSt1