Emacs Easy Draw is a drawing tool that runs inside Emacs.
- Emacs 27.2
- Image support
- SVG support
- gzip and gunzip(or zlib support)
- libxml support
(with-eval-after-load 'org
(require 'edraw-org)
(edraw-org-setup-default))
To start drawing, type [[edraw:]]
and type C-c C-o
on the link.
Draw something and type C-c C-c
and the data will be saved in the buffer.
[[edraw:file=./example.edraw.svg]]
[[edraw:data=<base64data>]
[[*Example][edraw:file=./example.edraw.svg]]
[[*Example][edraw:data=<base64data>]]
To toggle the inline display mode, type M-x edraw-org-link-image-mode
To edit the image, do one of the following on the link:
M-x edraw-org-edit-link
C-c C-o
- Right click on image
Customization Variables:
- edraw-org-link-export-data-tag
- HTML tag used to export data links. (svg or img)
- edraw-org-link-export-file-tag
- HTML tag used to export file links. (svg or img)
(autoload 'edraw-mode "edraw-mode")
(add-to-list 'auto-mode-alist '("\\.edraw\\.svg$" . edraw-mode))
NOTE: Setup later than other modes for .svg such as image-mode.
Emacs Easy Draw can only handle a small subset of the SVG specification, but the files it outputs can be viewed in a browser or other software that can handle SVG.
Most of the key bindings are displayed in menus and help echoes.
The key bindings that are not displayed are as follows.
- left, up, right, down : Move selected object
- S-left, S-up, S-right, S-down : Move selected object (10px)
- M-left, M-up, M-right, M-down : Move selected object (numerical input)
- Right-click on shape or anchor point or background : Show context menu
- (Select Tool) C-down-mouse-1 : Add/Remove clicked shape to selection list
- (Path Tool) C-u down-mouse-1 : Ignore existing points (Avoid connecting or moving existing points)
The following code is an example of inserting an editor into a buffer from Emacs Lisp.
(require 'edraw)
(progn
(insert " ")
(let ((editor (edraw-editor
;; Make an overlay that covers " "
;; 'evaporate means automatic deletion
:overlay (let ((overlay (make-overlay (1- (point)) (point))))
(overlay-put overlay 'evaporate t)
overlay)
;; Initial SVG
:svg (let ((initial-svg (svg-create 400 300)))
(dom-append-child
initial-svg
(dom-node 'g (list (cons 'id "edraw-body")) ;; g#edraw-body is the edit target area
(dom-node 'rect (list (cons 'x "100")
(cons 'y "100")
(cons 'width "200")
(cons 'height "100")
(cons 'fill "blue")))))
initial-svg)
;; Function called when saving
:document-writer (lambda (svg &rest _)
(pop-to-buffer "*svg output*")
(erase-buffer)
(edraw-svg-print
svg nil 'edraw-svg-print-attr-filter 0))
;; Add one item to the main menu
:menu-filter (lambda (menu-type items &rest _)
(pcase menu-type
('main-menu
(append
items
`(((edraw-msg "Close") (lambda (editor) (edraw-close editor))))))
(_ items))))))
;; Initialize editor
(edraw-initialize editor)
;; Add key binding
(overlay-put (edraw-overlay editor)
'keymap
(let ((original-keymap (overlay-get (edraw-overlay editor) 'keymap))
(km (make-sparse-keymap)))
(set-keymap-parent km original-keymap)
(define-key km (kbd "C-c C-c") (lambda () (interactive) (edraw-close (edraw-editor-at))))
km))))
edraw-color-picker.el contains a color picker library and some commands.
Show color picker in minibuffer:
- (edraw-color-picker-read-color)
Insert the selected color into the buffer:
- (edraw-color-picker-insert-color)
- (edraw-color-picker-replace-color-at-point)
A function that opens a color picker near the point:
- edraw-color-picker-open-near-point
A function that displays a color picker using an overlay:
- edraw-color-picker-overlay
The core class of the color picker:
- edraw-color-picker