Contact person: Three.js Architectural Model Interaction

Phone:Show

Email:Show

Location: Sha Tin Wai, Hong Kong

Budget: Recommended by industry experts

Time to start: As soon as possible

Project description:
"I have an existing web application and now need an interactive 3D viewer built with [login to view URL] / raw WebGL that can load a basic-structure architectural model. The viewer must live inside my current UI, follow its styling, and talk to my backend through REST endpoints that are already available.

Core workflow
• Load a lightweight .glTF (or similar) model at runtime via an API call.
• Display it inside a resizable canvas, respecting responsive layouts.
• Provide smooth model rotation and zoom with mouse, touch, and trackpad input. Keyboard shortcuts for preset angles (front, top, left, custom) are also required.
• Expose hooks so that other UI buttons can focus on specific objects (e.g., rooms or floors) and call my backend to pull related data.
• Emit events back to the app whenever the camera changes, so I can save a user’s last view.

I will supply:
– Endpoint specs and sample payloads
– The starter HTML/CSS shell
– A reference model in glTF

Deliverables
1. Clean, well-commented JavaScript/TypeScript source using [login to view URL] r160+
2. A single, drop-in module or React component (my app is React-based)
3. Brief setup notes and a 5-minute screen-share hand-off so I can compile and deploy it myself

Acceptance criteria
• Model loads on desktop and mobile 4G.
• Rotation/zoom stay above 50 fps on a mid-range laptop.
• All API interactions (load, focus, angle save) succeed and return expected JSON.

If you have prior examples of WebGL viewers, please point me to a live URL or repo." (client-provided description)