embedded sketchpad #4391
Replies: 1 comment
-
... and further down the line, one could imagine extending the concept to enable some interaction/two-way sync between sketches and code chunks, such as for example adding a hand-drawn annotation layer to plots or slides, etc. (and being able to edit/adjust this layer, programmatically or manually) ... and yet another step further down the line, one might imagine being able to interact directly with such sketches in the rendered document as well (Shiny, or Observable/d3, etc.), by targetting elements of the SVG. A classic use-case would be something like this, where the reader can play with a schematic electrical circuit, and see the values in the text and in the plots update in real time. |
Beta Was this translation helpful? Give feedback.
-
I think it'd be very useful to be able to make hand-drawn figures right within the editor, by embedding something like tl;draw or excalidraw. Both can store the sketch strokes as json/svg for further editing, and export either png/svg output.
(this is just a mockup)
draw.io/ comes close to achieving what I mean, in VScode at least, as you can have one panel open to edit the drawio file, while another panel is showing directly the output embedded in a qmd document.
With the {minidrawio} and {devoutdrawio} packages by @coolbutuseless, one can easily generate a graphic first, then edit it at will interactively and have the graphic embedded in quarto update in real-time.
(those are actual screenshots)
I'll note that the 3 apps have a visual VScode plugin, so getting this to work with two tabs side-by-side seems relatively straight-forward. I'm not sure about the feasibility of editing the sketch directly within the document in visual mode (is this kind of interaction possible in VScode, mixed with regular text?). I'm also not sure of this for Rstudio's visual editor (it can display plots, equations, etc. but can an interactive widget be embedded?). Similar to VScode, the sketchpad could be displayed alongside in the html preview/plot pane (here's an old experiment by timelyportfolio)
Beta Was this translation helpful? Give feedback.
All reactions