Alternative excalidraw integration

Current approach for excalidraw integration suffers from

  1. outdated excalidraw features
  2. a lot of bugs (just search excalidraw in issues)

I propose an alternative way. I’ve been using this approach in Emacs (implemented using custom link, fswatch, excalidraw-cli) for a long time and am pretty happy with it.

  1. use excalidraw pwa for editing excalidraw file
  2. automatically converts .excalidraw to .svg or .png in background
  3. render the images in logseq

This would provide a much cleaner and smooth user experience for now, given that the current approach would require a lot of manpower.

What do you guys think?

Can you please share your script? :pray:

Emacs config (I use Doom Emacs)

(after! org
  (org-add-link-type "excalidraw" 'org-excalidraw-open)

  (defun org-excalidraw-open (name)
    "open excalidraw"
    (let* ((excalidraw-appdata-root "~/Dropbox/Appdata/Excalidraw")
           (excalidraw-empty-file (f-join excalidraw-appdata-root ".empty.excalidraw"))
           (excalidraw-path (f-join excalidraw-appdata-root (concat name ".excalidraw")))
           (excalidraw-export-path (f-join excalidraw-appdata-root "Exports" (concat name ".svg"))))
      (unless (f-exists? excalidraw-path) (f-copy excalidraw-empty-file excalidraw-path))
      (quiet! (shell-command (concat "open " (shell-quote-argument excalidraw-path))))
      (message (concat "Openning " excalidraw-path))
      ))
  )

YASnippet for inserting excalidraw link and the image

# key: <ex
# name: Excalidraw
# --
[[file:~/Dropbox/Appdata/Excalidraw/Exports/${1:filename}.svg]]
[[excalidraw:$1]]

CLI for converting .excalidraw to .svg: GitHub - aur3l14no/excalidraw-cli: convert excalidraw file to png / svg file
(font is not rendering correctly right now)

1 Like

It is a good idea to just using the official excalidraw PWA to draw and render image in logseq.
The edit experience of excalidraw inside logseq is not good.

I tried a workaround with using the Obsidian - Logseq concurrent use (see for example Getting Logseq + Obsidian to work together - Creating My Digital Mind (Episode 7) - YouTube)

…in the hope to use Obsidian to create and edit pages that contain excalidraw images.
Obsidian has a very well integrated escalidraw plugin, which allows many ways to create and embed the drawings, such as automatic png embed.

I did not succeed yet in making pages with such Obsidian created embeds appear in Logseq. If anyone had success, let me know please, thanks.