On Nov 08, 2011 I wrote Box diagrams in HTML and Unicode, on the subject of Hacks.

diag2box.py. Stupid little script to turn

+--------+      +-----------+
| #daft  +------+ @diagrams |
+--------+      +-----+-----+
                      |
    +-----------------+------------+
    |                              |
+---+------+               +-------+----+
| suddenly |               |            |
| become   +---------------+ to unicode |
| changed  |               |            |
+----------+               +------------+

# fragment-daft
@ fragment-diagrams

into

┏━━━━━━━━┓      ┏━━━━━━━━━━━┓
┃  daft  ┣━━━━━━┫  diagrams ┃
┗━━━━━━━━┛      ┗━━━━━┳━━━━━┛
                      ┃
    ┏━━━━━━━━━━━━━━━━━┻━━━━━━━━━━━━┓
    ┃                              ┃

┏━━━┻━━━━━━┓               ┏━━━━━━━┻━━━━┓
┃ suddenly ┃               ┃            ┃
┃ become   ┣━━━━━━━━━━━━━━━┫ to unicode ┃
┃ changed  ┃               ┃            ┃

┗━━━━━━━━━━┛               ┗━━━━━━━━━━━━┛

Sam

Here's what I see on the mac they force me to use at work. http://imgur.com/ZiQBr

Mikko

You are probably aware of DITAA: http://ditaa.sourceforge.net/

Benedikt

I get the same look like Sam with Chrome 15.0.874.106 on Windows

Flimm

@Mikko: DITAA turns ASCII art into images. Stu's script turns ASCII art into different ASCII art using non-ASCII characters like ┫, ┣ and ━.

sil

Sam, Benedikt: heh. So much for unicode, eh? The text is wrapped in pre tags, but maybe pre isn't formatted to be monospace for you. Perhaps I should have overridden that. That's what happens when I spend half an hour writing something rather than doing it properly, I suppose. :)

Flimm: indeed. I did think about using ditaa but then thought, well, I can't be bothered to upload the image and then host it somewhere. Plain text ftw. :)

Rowan

I wonder if you couldn't generate SVG instead? Seems like that'd be the best option.

Pádraig Brady

That's quite cool. thanks!

I tested with export from http://www.asciiflow.com/

I'd prefer actually if it spit out the unicode chars directly,

and then I could use http://www.pixelbeat.org/scripts/ansi2html.sh to convert to html if required.

p.s. a caveat I noticed is there can't be blank lines at

the top of your diagram

Ben

Looks fine here, but there's an extra line with no characters above the bottom two boxes and inside the bottom of the bottom two boxes.

ZeD

http://pypi.python.org/pypi/aafigure anyone?

Matthias

Doesn't work for me either, looks exactly like Sam's picture. Safari renders pre elements with font-family:monospace but to be sure I explicitly switched over to Monaco with the web inspector. Still looks broken.

sheffield company

I try it.not so good.

Kaif

Not so bad.