imgcat: higher resolution | Hacker News Reader

imgcat: higher resolution

github.com

178 pointstosh48 comments

Hi! I made imgcat. I wanted to say how wonderful it is to wake up and find myself on the front page of hackernews.

Things are so hard right now in the pandemic and this has given me a little virtual hug.

Big thanks to the eng team at https://charm.sh/ who wrote the terminal library I am using and showed up with prs and great ideas.

That's really cool!

If you want to further add vertical resolution, Unicode 13 introduces 2x3 mosaics (from the TRS-80, Teletext and others) that are supported directly within VTE (so people don't need to install a font). Slightly more complicated are the "smoothed" mosaics (from Minitel 2, IIRC) but they offer diagonal lines (and complement PETSCII and ATASCII symbols also introduced in version 13).

I expect 2x4's to be available for version 14, but it'll be a while.

2x3's (and 2x4's) are kind of funny, because you still won't be able to use more than 2 colors per cell, so it works for cells with two colors but that can be subdivided in thirds (or quarters). Finding a best fit for a cell and a mosaic is not a trivial job.

Have you considerd using sixel (https://en.m.wikipedia.org/wiki/Sixel) to get full resolution?

Oh, nice:

https://saitoha.github.io/libsixel/

It's a shame support is relatively limited. Apple's Terminal doesn't (even though it passes the VT-100 torture test, which is, in itself, remarkable), nor does the VTE-based ones common in other unixes.

Next level: https://hpjansson.org/chafa/ which finds unicode symbols that approximate the content best.

Or perhaps just write a more capable terminal?

But why would anyone do that if you can just bend over backwards with the current implementation?

Resolution?

You don’t need to. Most terminals already support graphics.

https://github.com/saitoha/libsixel

Here is the commit in case anyone is interested: https://github.com/trashhalo/imgcat/commit/1f9ef8c888fa93e1e...

I don't understand it. It appears to split pixels in two (check the special unicode ascii art character on line 142[0]), not in four as the screenshot would suggest. Is that special character half-width in certain terminals, or something?

EDIT: ahhh I got it! Before this commit, they printed out two spaces for a single pixel to closer resemble a square, because most terminal fonts are much taller than they're wide. They replaced that by a single character that has one color in the top half and one color in the bottom half. Each of those halves, again, are almost square (HN doesn't let me display the character here, it filters out certain unicode ranges)

[0] https://github.com/trashhalo/imgcat/commit/1f9ef8c888fa93e1e...

How does it double the resolution in both axis? Or did it waste half the resolution to get square pixels before?

edit: it did: two spaces here https://github.com/trashhalo/imgcat/commit/1f9ef8c888fa93e1e...

For us that lived through the BBS times during 80s and 90s, this was the standard trick to achieve gradients and more colors.

Yep! This is actually where muesli got the idea from:

https://twitter.com/charmcli/status/1320184218794795010

There's another tool, tiv, which uses a wider range of unicode characters (and has done for years). It's quite slow though.

https://github.com/stefanhaustein/TerminalImageViewer

I use a shell script from Gnome's Virtual Terminal codebase, which seems to do more-or-less the same thing, and has used these two Unicode characters for at least 6 years:

https://gitlab.gnome.org/GNOME/vte/blob/0.36.0/perf/img.sh

Symbols for Legacy Computing (Range: 1FB00–1FBFF) would be a helpful block to look at as a possible optional even-higher-fidelity mode. Has all kinds of slopes that you could better approximate edges with.

You could probably solve for it efficiently by computing a small Histogram of Oriented Gradients block, say 3x3, and use that as a hashmap key. Or Sobel filters might be even easier.

You can take the concept even further. I made this about 4 years ago now: https://github.com/daleroberts/tv

Question: are there any charting libraries based on the same principles?

Not the same principle, but in case you hadn't heard of sixel (https://github.com/saitoha/libsixel), there's sixelplot (https://github.com/kktk-KO/sixelplot)

Visidata is pretty cool - https://www.visidata.org/

While it offers console based interactive exploration of your data you can also get it to just spit out the graph you want.

If we finally (at 2020) get some sort of stable image capability to the terminal, we can start to have a lot of charting or other creative capabilities incorporated into CLI tools instead of the ancient way of drawing by characters.

Is there a reason why the terminals aren't evolving toward that way?

What would be the difference then with a plain X (or wayland) app launched from the terminal ?

Ergonomics.

Charts, small images, interactive diagrams, flow charts etc can be more ergonomic when part of the CLI text flow than opened as a separate window.

You can run from any platform on a remote server without GUI support?

It's a huge difference.

Next Step: Implement Truecolor in linux console (fbcon).

It is partially done, but the remaining work requires "large amount of code".

https://github.com/torvalds/linux/commit/cec5b2a97a11ade56a7...

Or use iTerm2 and get as much resolution as you want:

https://iterm2.com/features.html#inline-images

iTerm2 is only available for macs right? imgcat can work with any terminal that is able to display colored characters.

https://sw.kovidgoyal.net/kitty/kittens/icat.html

How many competing protocols are there for displaying images in a terminal? There's this, iTerm2 (also supported by Secure Shell[1])... any others? We need one unified standard[2] for graphics in terminal emulators!

[1] https://chromium.googlesource.com/apps/libapps/+/HEAD/hterm/...

[2] https://xkcd.com/927/

Don't forget the classic SIXEL: https://github.com/saitoha/libsixel

Correct.

Isn't this a 35 year old trick? I could have sworn I've known about it for at least 25

Lots of tricks are old.

You've just got to think of and apply them in the right context.

Most of the world's major breakthroughs are basically just this.

what I mean is I don't understand why the post is significant.

This is something I'd expect to see done by just about anybody along with the full 8th blocks https://en.m.wikipedia.org/wiki/Block_Elements on literally the first day or two of starting this kind of project.

I like positive open source threads sure, but is that what this is about or is there some extraordinary technical details I'm not seeing?

Examples of people being nice to each other in FLOSS projects is certainly something we could always use more of, sure. Is that what this is?

> Examples of people being nice to each other in FLOSS projects is certainly something we could always use more of, sure. Is that what this is?

Yes. That's how I interpreted it, at least. (I think it's great)

Yes. See "libaa" and the "bb" demo.

http://aa-project.sourceforge.net/aalib/

Yep, it was used in ansi graphics on BBSes back in the day

That's correct! In fact when we announced this we mentioned that the BBS technique was what inspired this PR:

https://twitter.com/charmcli/status/1320184218794795010

It's interesting to see forgotten lore or techniques reemerge. We (Charm) have just published a TUI framework called Bubble Tea and imgcat was one of the first tools that implemented it, so we were excited to see the progress and help with rendering.

https://github.com/charmbracelet/bubbletea

I love the run-around time between idea, implementation, release! Great job.

Curious, what are people using this for?

This is really cool.

Reminds me that templeOS did bring something interesting to the table that we could probably learn from.. Why shouldn't our terminals be able to show images and video.

Reply on news.ycombinator.com