Building a DXF-Compatible Rich Text Editor for a Web-Based CAD Tool
Last week I spent most of my time working on the text editor for my web-based CAD application, https://kulmanlab.com/.
This update was focused on improving DXF compatibility and making text editing more flexible, predictable, and closer to how modern design tools behave.
📌 DXF MText Support
First of all, MText from DXF is now fully supported.
This means you can:
- Create your blueprint in any CAD tool of your choice
- Export it as DXF
- Import it into KulmanLab
- And keep text styling preserved
This was an important milestone because DXF text handling is often inconsistent between tools. Preserving formatting improves interoperability and reduces manual rework.
🔄 Unifying Text: One Object Instead of Two
Previously, the system had two separate concepts:
TextMText
I decided to simplify this.
Now everything is unified into a single Text object.
Why?
A "simple" text entity is essentially just a multiline text object with one line. Maintaining two separate implementations added complexity without much real benefit.
Unifying them makes the system:
- Easier to maintain
- More predictable
- More extensible for future formatting features
✍️ Rich Text Editing Experience
The Text command now supports a more modern editing experience.
When placing text, you can:
- Choose font family
- Set font size
- Apply styles:
- Bold
- Italic
- Strikethrough (more coming soon)
After placement, the text is rendered inside a blue bounding frame, which defines the wrapping area.
Interactive layout control
- A live resize handle allows you to adjust wrapping width dynamically
- Text reflows instantly as you resize the frame
This makes layout control much closer to what you'd expect from modern design tools rather than traditional CAD text input.
🧠 Smart Cursor & Formatting Behavior
One of the trickier parts was making the cursor behave correctly in a mixed-format text environment.
Now:
- Cursor height adapts to the active character style
- Cursor position reflects font size changes in real time
- Mixed formatting doesn’t break alignment or insertion behavior
This ensures consistent editing even when different styles are applied within the same text block.
📍 Multiple Attachment Points
Text objects now support multiple attachment anchors:
- Top-left
- Top-right
- Bottom-left
- Bottom-right
- Center (and others)
This makes positioning more flexible, especially in technical drawings where alignment matters.
🎨 Character-Level Styling
One of the more powerful features is fine-grained text styling.
You can now:
- Bold individual words
- Change font size per character
- Mix fonts within a single text object
- Combine multiple styles in one sentence
This moves the editor closer to a true rich-text system rather than a simple label tool.
📦 Frame Visibility & Layout Control
A frame toggle allows you to show or hide the bounding box around text.
This is useful for:
- Layout debugging
- Precise alignment
- Clean final rendering
🚀 What’s Next
I believe the application is now usable enough for most basic workflows.
Next step is shifting focus toward:
- SEO optimization
- Landing page improvements
- Product promotion and visibility
The core editing engine is becoming stable enough to support this transition.
💭 Closing Thoughts
Building a text system that behaves consistently across CAD + web constraints turned out to be more complex than expected.
But the result is a much more flexible foundation that should support future features without major rewrites.
If you're interested in web-based CAD or DXF tooling, feel free to check out:
Top comments (0)