| name | panel-image |
| description | Deep Image panel knowledge: the panel is ThreeDeeRender's ImageMode SceneExtension, WorkerImageDecoder pipeline, camera-model projection (pinhole/fisheye), and annotation overlays. |
Panel Image Skill
The Image panel is not a separate panel — it is a specialized mode of the 3D panel
(ThreeDeeRender) that uses a 2D camera projection.
Architecture
ImagePanel (re-export wrapper, panels/Image/)
│
▼
ThreeDeeRender (Renderer.ts)
│
▼
ImageMode SceneExtension
│
├── WorkerImageDecoder (JPEG/PNG/… in a Worker)
├── Camera-model projection (pinhole, fisheye, …)
└── Annotation overlays (boxes, points, text)
Core Components
| File | Role |
|---|
renderables/Images/ImageMode.ts | SceneExtension for image display |
renderables/Images/WorkerImageDecoder.ts | Worker-based image decoding (Comlink) |
renderables/Images/WorkerImageDecoder.worker.ts | Worker-side decode implementation |
renderables/Images/annotations/ | Overlay rendering (boxes, points, text) |
Image Decoding Pipeline
- Raw image message arrives (compressed JPEG/PNG or raw bytes)
- Sent to
WorkerImageDecoder via Comlink (off the main thread)
- Decoded to an
ImageBitmap or raw pixel buffer
- Applied as a THREE.js texture on a plane geometry
- The camera model determines UV mapping (handles distortion)
Camera Models
- Pinhole — standard perspective projection