Document code with pictures directly within the editor


#1

Hi,

I usually code algorithms and scientific calculations. I use diagrams to visualise how variables interact with each other and how loops are intended to run.

I used to post this diagrams to imgur and then post the link to the picture as a post comment, but I was wondering if it wouldn’t be awesome to “see” the picture in the code directly?

I can imagine being able

  • to collapse or open the picture, like functions direct in the code
  • being able to add pictures directly from the code editor
  • change or delete a picture

I haven’t seen such feature in any editor yet, what do you think?


#2

Not sure of the side effects of inserting images in the code directly (the layout assume that all rows have the same height), but I think the regex-railroad-diagram could be a good starting point for this kind of feature.


#3

Yes, it could have side effects… but I think the benefits are worth discussing it.

The image could be inserted as a link escaped in a comment, for example for js: /img img/


#4

Not so shameful plug: It should also have the hosting feature from auto-host-markdown-image. You just drag the image from the desktop and everything else is automatic. Check it out.

Also, I personally believe the image should appear in a pop-up. Check out git-diff-popup.


#5

Yea! this is really cool! I feel like it’s almost there :smile:

I like the idea of having the image in a pop up. and the logic of auto-host-markdown-image is surely a step closer to what we want here.