search

andorsk / d2-mode

emacs major mode for d2 graphs
GNU General Public License v3.0
63 stars 7 forks source link

Seems Imagemagick didn't handle SVG well as expected. #13

Open suliveevil opened 1 year ago

suliveevil commented 1 year ago
截屏2022-11-28 10 23 40
andorsk commented 1 year ago

Thanks @suliveevil. will get back to you on this. As some level this is blocked by #8 from my end. It would be great if eventually d2 supports pngs. SVG's just don't play as well with emacs. I think I can get it to work, but I need to fix #8 first

andorsk commented 1 year ago

confirmed repeatability

image

Browser renders correctly:

image
andorsk commented 1 year ago

This a more general issue with imagemagik and svgs convert input.svg output.png reproduces the issue.

andorsk commented 1 year ago

The way I see it, there are two fixes:

  1. See if there's a fix for imagemagick and svgs.
  2. See if convert to png first with some other command, then just read that. I'm leaning toward that.
suliveevil commented 1 year ago

Or we may should find another tool to convert svg to png?

andorsk commented 1 year ago

yea...possible. i'll need to look into it and get back on this.

andorsk commented 1 year ago

referencing here https://github.com/andorsk/d2-mode/issues/8

andorsk commented 1 year ago

since this is an emacs related issue, I don't see an easy way around this without saying "upgrade your emacs", however I have added support for a complementing method at #19 , which allows you to open up the browser directly from emacs through the new supported commands: 

(defvar d2-mode-map
  (let ((map (make-sparse-keymap)))
    (define-key map (kbd "C-c C-c") 'd2-compile)
    (define-key map (kbd "C-c C-f") 'd2-compile-file)
    (define-key map (kbd "C-c C-b") 'd2-compile-buffer)
    (define-key map (kbd "C-c C-r") 'd2-compile-region)
    (define-key map (kbd "C-c C-h") 'd2-compile-file-and-browse)
    (define-key map (kbd "C-c C-j") 'd2-compile-buffer-and-browse)
    (define-key map (kbd "C-c C-k") 'd2-compile-region-and-browse)
    (define-key map (kbd "C-c C-o") 'd2-open-browser)
    (define-key map (kbd "C-x C-o") 'd2-view-current-svg)
    (define-key map (kbd "C-c C-d") 'd2-open-doc)
    map))

This allows the browser to render the svg, which should work pretty well.

alixander commented 1 year ago

d2 is able to convert to png, e.g. d2 input.d2 out.png. i'm not 100% sure it would work in this context though, as it involves using headless browsers.

we also ran into some subpar svg rendering when building the Obsidian integration. we got around this by base64 encoding the SVGs. didn't end up going with that in the end, but it did work