Excalidraw embed
This thing is one thing that attracted me toward AnyType (although it was removed for some issues).
The implementation in AnyType was very sloppy and it needs to be rethought
Why
When creating notes, it is often that we need some diagrams that go with it and excalidraw provides an excellent editor for it.
My thoughts
Like mermaid code blocks, it could be a code block that is tagged excalidraw. It could then be rendered as the slides of frames. And an edit button or double click could open a full screen excalidraw for editing.
In the page, the frames doesn't have any UI (Rendered just like image)
4 Comments
Sign in to comment
·about 14 hours agoThanks for the detailed suggestion, Alaz. This is a thoughtful take on embedding diagrams alongside notes.
To help us scope this properly, a couple of clarifications:
- Workflow: When you say "edit button or double-click opens full-screen excalidraw" — are you picturing the diagram state stored within the code block itself (so edits persist in the page), or would it be more like opening an external tool and then re-importing the result?
- Frame rendering: You mentioned rendering as "slides of frames" — do you mean Excalidraw's native frame feature (multiple scenes), or just showing the full canvas as a single embedded view?
- Use cases: Beyond quick sketches alongside notes, what's the main friction point you hit with the AnyType implementation that made it feel sloppy? Knowing what didn't work helps us avoid the same pitfall.
- Yes, diagram state stored within the code block itself would be the target for storage. But the excalidraw editor could be external or internal. Both are fine till they save their edited state in the target code block itself. And it doesn't need to be code block, It is just that using code block is very extensible.
- I meant showing excalidraw's native frames (multiple scenes) as a slide (next, prev button to move between them). And if that doesn't exist, it could show the whole view. But it should only show the rendered image/svg and not the editor itself, which was the issue with AnyType as it interfered with the scroll input.
- Good question
The AnyType's implementation had these issues--
1. The editor was rendered in the page directly causing multiple editors per page and slowdowns.
2. Also, when scrolling through the page, one could accidentally scroll through the drawing itself, very annoying.
3. The editor tools obstructed the view and there was very little space to view the drawing itself.
4. The editor always had 100% zoom and centered at 0,0 which caused some elements to be out of the screen.
Thanks again for the detailed write-up, Alaz. It shaped the design directly. Excalidraw drawings are now implemented and in review, and here's how they address what you described:
```excalidrawblock holding the scene, so it travels with the page and other Markdown tools still see it as a code block./excalidrawto start a new drawing.Two limits in this first version: images inside drawings aren't supported yet, and Chinese, Japanese and Korean text in a drawing uses a system font instead of Excalidraw's handwritten one. We'll post here when it ships.
You are cooking fast. Love your speed ❤ and explanation.