How wiscaksono/cadview works
@cadview is a browser-based CAD drawing viewer: users load DXF (or optionally DWG), then view, navigate, select, and measure drawing geometry. Its runtime spans format conversion and parsing, document rendering, and interactive viewer tools; React, Svelte, and Vue packages adapt the core for framework applications. The README documents several capabilities whose internal wiring is not shown in the sampled source, so the graph represents those documented links at subsystem level and omits uncertain implementation details.
Main entry points: viewer.ts CAD viewer · parser/index.ts DXF parser · canvas-renderer.ts Canvas renderer · src/index.ts DWG converter
Components 24
Formats and parsing
- DXF parser
packages/core/src/parser/index.ts - DXF tokenizer
packages/core/src/parser/tokenizer.ts - Section parsers
packages/core/src/parser/sections - Entity parsers
packages/core/src/parser/entities - Parse worker manager
packages/core/src/worker/worker-manager.ts - Parse worker
packages/core/src/worker/parse-worker.ts - DWG converter
packages/dwg/src/index.ts
Viewer and rendering
- Core API
packages/core/src/index.ts - CAD viewer
packages/core/src/viewer/viewer.ts - Input handling
packages/core/src/viewer/input-handler.ts - Camera and transforms
packages/core/src/renderer/camera.ts - Canvas renderer
packages/core/src/renderer/canvas-renderer.ts - Entity drawing
packages/core/src/renderer/entities/index.ts - Themes and colors
packages/core/src/renderer/theme.ts - Spatial selection
packages/core/src/viewer/selection.ts - Measure and snap
packages/core/src/viewer/measure.ts - Layer controls
packages/core/src/viewer/layers.ts - Geometry bounds
packages/core/src/utils/bbox.ts
Framework integrations
- React wrapper
packages/react/src/CadViewer.tsx - React hook
packages/react/src/useCadViewer.ts - Svelte wrapper
packages/svelte/src/lib/CadViewer.svelte - Vue wrapper
packages/vue/src/CadViewer.tsx - Vue composable
packages/vue/src/useCadViewer.ts
Other components
- Application user
Connections 32
- Application user → CAD viewer: loads and operates
- Core API → CAD viewer: exports
- CAD viewer → DXF parser: parses DXF
- CAD viewer → Parse worker manager: offloads parsing
- Parse worker manager → Parse worker: dispatches parse
- Parse worker → DXF parser: parses payload
- DXF parser → DXF tokenizer: tokenizes input
- DXF parser → Section parsers: parses sections
- Section parsers → Entity parsers: parses entities
- CAD viewer → Canvas renderer: renders document
- Canvas renderer → Entity drawing: draws entities
- Canvas renderer → Themes and colors: resolves display colors
- CAD viewer → Camera and transforms: updates view
- Canvas renderer → Geometry bounds: fits drawing bounds
- Input handling → CAD viewer: dispatches input
- CAD viewer → Input handling: handles canvas input
- CAD viewer → Spatial selection: selects entities
- CAD viewer → Measure and snap: measures and snaps
- CAD viewer → Layer controls: controls layers
- Application user → React wrapper: uses component
- React wrapper → CAD viewer: adapts core viewer
- Application user → React hook: uses hook
- React hook → CAD viewer: creates and controls
- Application user → Svelte wrapper: uses component
- Svelte wrapper → CAD viewer: adapts core viewer
- Application user → Vue wrapper: uses component
- Vue wrapper → CAD viewer: adapts core viewer
- Application user → Vue composable: uses composable
- Vue composable → CAD viewer: creates and controls
- Application user → DWG converter: supplies DWG
- CAD viewer → DWG converter: optionally converts format
- DWG converter → DXF parser: returns DXF for parsing