Updating images

[HM0880]

See #136 (comment) and #136 (comment) for initial discussion on updating the images.

This issue is to discuss the @pronoiac's bookmarks and thoughts about diagrams.

[pronoiac]

I wrote a long braindump, but here are the useful bits:

Mermaid and Graphviz / dot are useful diagramming languages, but not flexible enough, though that might be a lack of imagination on my part.

We could recreate the diagrams with diagrams.net; I think this is my current favorite. I've puttered around with it with a couple of nights of watching TV and made progress. (Figures 6.1 and 6.2 seem hard though.)

We could use scans (forthcoming!) or vectorize them, but those would be less editable in the future.

I think desktop apps might offer more power and flexibility, but also introduce friction for editing later.

I could post some WIP images, though I might use a gist.

[pronoiac]

I posted an attempt / trial / demo with diagram 2.1, made with diagrams.net. I added the source to the repo; it's also embedded in the png and svg files. I think I rendered the png at 200% zoom.

[pronoiac]

My WIP diagrams branch has chapter 2 and chapter 3 using remade diagrams.

Notes:

• I'm using tables to attach captions to images. (I'm possibly inconsistent on the topic of captions. Sorry.)
• The sizes of the diagrams weren't consistent. Figures 3.2 and 3.3 for example were gigantic. I've opted to scale them down.
• I might go on a PR-merging spree after this. Waiting a bit gives time for peer review, or for me to look at them with fresh eyes, and I'm happier untangling mine than others' merge conflicts.

[HM0880]

I like the thicker text in the PNG files in the demo link.

You use SVG in Ch. 2 and Ch. 3 though (haha). Can SVG dynamically use the font size of the main page? SVGs are probably the best format to use, and slightly larger font would make the SVGs easier to read.

[pronoiac]

I like the thicker text in the PNG files in the demo link.

Aaargh. On my Mac, SVG and PNG look about the same, and thicker. On my iPad, they're different - in Safari, and in the two ebooks, the text is indeed thinner in the SVGs. Re-exporting with different text settings, like embedding the font or converting text to curves, might help.

For diagram resolution, I aimed at roughly whatever made print preview roughly agree with the paper copy: usually, roughly the original JPEGs, or about half that. Looking at print previews, Figure 3.2 was basically a full page, which felt like too much, before I scaled it down.

You use SVG in Ch. 2 and Ch. 3 though

If the markup is working correctly, the browser should try SVG first, and failover to PNG if that doesn't work. That might rely on Javascript.

Can SVG dynamically use the font size of the main page?

Not that I'm aware of.

---

This might explain a bit - default font sizes:

• on Github, 16 pt
• on diagrams.net, 12 pt

I tweaked figure 2.1 to 16pt, and tried the alternate text settings.

• on my Mac, the embedded font SVG looks like the PNG.
• on my iPad, both SVG have thinner text.

Perhaps Github is stripping fonts / styles from SVG, for security? Or maybe SVG and fonts aren't playing well together.

Who knows. I'm mystified. Personally, I might be done poking at SVG for a while.