Vertical Layouts for Canvas Text (CJK)

I have noticed a discussion (I have cut some parts for readability) about vertical layout for text from the participants of the HTML WG.

<Hixie> ok for canvas text my proposal is:

<Hixie> drawHString(x, y, maxWidth, textAlign, s); and drawHString(x, y, maxHeight, textAlign, s);

<Hixie> drawVString(…) for the second one

<Lachy> what’s the difference between them? drawVString for vertical stings where the letters are stacked on top of each other, and not just rotated 90 deg?

<Philip`> Hixie: They look complex and hard to use :-p

<Philip`> compared to e.g. translate(x,y);drawString(s)

<Hixie> lachy: drawVString() would be for vertical text (e.g. some CJK)

<Hixie> one is lack of support for vertical text :-)

In printed media, it is handled quite well for a long time. Japanese books have some complex layouts mixing western and japanese characters.

Japanese Typography

It happens not only in CJK (Chinese Japanese Korean) texts. Think about a neon sign of an hotel with the letters written vertically.

Felix Sasaki is my colleague at W3C/Keio and has worked with the Japanese Layout Task Force. He was sitting next to me when I was reading the logs of the discussion, so I just asked him some references. He sent me a link to 1.3 Directional Factors in Japanese Text Layout from the Requirements of Japanese Text Layout. He also reminded me about XSL 1.1: 7.29.3 “glyph-orientation-vertical” .

Wikipedia has a page on the topic of Horizontal and vertical writing in East Asian scripts and Unicode a note on Robust Vertical Text Layout.

All of that should help to define the API for Canvas Text.

One thought on “Vertical Layouts for Canvas Text (CJK)

  1. Yup, I was reading most of the above (as well as CSS3 text and XSL:FO, and studying actual graphics and charts on japanese sites) when doing my research for this. Thanks for the link to jlreq btw, didnt’ know about that one.

    Note that we’re not trying to do full typography here, we’re trying to do an immediate mode graphics API. The needs are different from the needs of book publishers. :-)

Comments are closed.