KJDRAW / INTRODUCTION
Introduction
KJDraw is a programmable CAD foundation for engineering applications, browser workbenches and reviewable AI-agent changes.
What KJDraw is#
KJDraw gives web applications a complete embeddable CAD editor and a TypeScript SDK for building specialized drawing experiences. One createKJDrawEditor() call mounts the canvas, tools, layers, properties and file actions. React and Vue components provide the same editor with framework-native lifecycles.
Use it to display and edit engineering drawings, open or export KJD and DXF files, add product-specific tools, automate repeatable changes, or let an AI assistant prepare changes for a person to review.
Choose your starting point#
| What you are building | Start with | You get |
|---|---|---|
| JavaScript or TypeScript app | createKJDrawEditor() | A ready-to-use editor and a small imperative API |
| React app | @kanjieteam/kjdraw/react | <KJDraw> plus a typed editor ref |
| Vue app | @kanjieteam/kjdraw/vue | <KJDraw> plus exposed editor methods |
| Custom CAD interface | @kanjieteam/kjdraw/core | Documents, commands, files and your own UI |
| AI-assisted workflow | @kanjieteam/kjdraw/agent | Reviewable plans, approval and execution receipts |
What you can do#
- Start with a sample drawing or an empty canvas, then zoom, select, draw and inspect objects.
- Open and save KJD or DXF, manage projects, and integrate your own storage flow.
- Execute typed commands with undo and redo, or subscribe to document and selection changes.
- Switch English or Chinese UI, light or dark appearance, and classic, compact or canvas-first focus layouts at runtime.
- Add plugins, custom commands, renderers and AI-assisted workflows as your product grows.
Start with Quickstart, then keep the task-oriented Editor API beside your code. The complete TypeScript reference covers every public package entry.