漫画

絵がコマになり、セリフも心の声もナレーションも音も、すべてMarkdownのテキストです。

Postextの漫画は、絵の一式と台本でできています。絵は、文字を入れずに描いたふつうのビットマップかSVGのリソースです。台本は章のMarkdownに書きます。:::pageブロックがページをコマに割り、各コマに絵を与え、そのコマの吹き出し、ナレーション、描き文字を1行ずつ並べます。Postextはコマを割り付け、大事な部分を切らないように絵を各コマに合わせてトリミングし、文字を本の写植書体で一つのサイズに組み、その周りに吹き出しを描き、しっぽを話者に向け、顔を隠さない位置に読む順に吹き出しを置きます。翻訳は、同じコマに別の言葉を入れたもう一つのMarkdownファイルです。Postextはそれを一から写植し直し、日本語なら縦書きに、アラビア語なら右から左に組みます。

漫画の機能は、使うときだけ働きます。:::pageも:::stripもない文書は、これまでとまったく同じに組まれます。設定は設定のcomicsの節に、記法の要約は文書形式 › 漫画にあります。

#漫画のページ

:::pageブロックが漫画の1ページです。:::page{…}の行で始め、コマごとに::panelの行とそのコマの台本を続け、何も付けない:::で閉じます。

:::page{split="30 [30 | 20 | *] / *" gutter=4mm}
::panel{art=lh-arrive}
caption: 毎年夏になると、マヤは灯台で一週間を過ごした。
maya: おじいちゃん！来たよ！
::panel{art=lh-radio}
tomas: ちょうどよかった。無線が聞こえなくなってな、
tomas: 嵐が近づいとる。
::panel{art=lh-maya}
maya{thought}: あの真空管、ゆるんでるみたい…
::panel{art=lh-beam bleed}
sfx{rotate=-8}: バキッ
tomas{shout}: 手すりにつかまれ！
:::

ブロックは必ず新しいページから始まり、そのページ全体を使います。閉じのフェンスの後の文章は次のページから始まるので、:::pageブロックを2つ続ければ漫画のページが2ページになり、間に:::pagebreakを入れてもページは増えません。エンジンはブロックの中身を、:::verseと同じように自分で1行ずつ読みます。中ではMarkdownのブロック、コンテナー、ほかのディレクティブは認識されず、<!-- comments -->は複数行にわたるものも含めて無視されます。

ページの役割は'comic'（VDTPage.role）です。漫画のページはコマだけでできているので柱もノンブルも入りませんが、ページ番号には数えられます。comics.runningHeads: trueにすると柱とノンブルが入ります。コマは枠から割り付けます。枠はふつうページの余白の内側の版面ですが、comics.frame.marginsで漫画のページに独自の余白を与えることもできます。

開始行の属性は次のとおりです。

#ページの分割

split属性は、ページを割り方の木として書きます。/で区切ったサイズの並びは区画を上から下へ積み（段）、|で区切った並びは区画を読み始める側から横に並べます。サイズの後に角かっこで並びを書くと、その区画をもう一方の向きでさらに割ります。上の例のページ30 [30 | 20 | *] / *は、枠の高さの30%の段を、幅の30%のコマ、20%のコマ、残りを取る3つ目のコマに割り、その下にページの残りを取る2段目を置いたものです。Sandboxの画面では、この区画を「割り」と呼んでいます。

文法の全体は次のとおりです。

split := list
list  := item ( "/" item )*  |  item ( "|" item )*
item  := size [ "[" list "]" ]
size  := number ["%"] [ "~" number ["%"] ]  |  "*"  |  (nothing)

• サイズは、並びの向きに沿った親の区画に対する割合です。30と30%は同じ意味です。*か空のサイズは、書いたサイズの残りを等分して取ります。並びの最後の項目は、サイズに何と書いてあっても常に端まで伸びます。
• 1つの並びに区切りは1種類。同じ並びに/と|を混ぜること、[を閉じないこと、親と同じ向きの角かっこの並びを書くことは、いずれも構文エラー（comicSplitSyntax）で、読める部分だけが使われます。
• 合計が多すぎるとき。サイズの合計が100%を超えると、各*に5%が残るように縮められ、ページはcomicSplitOverflowを報告します。
• 読む順は木の順です。段は上から下へ、段の中のコマは始まり側から読みます。::panelの行はこの順に区画を埋めます。区画より多くのコマがあるページでは余ったコマは組まれず、少ないページでは最後の区画が空のまま残ります（comicPanelCount。splitを書いたときだけ報告します）。

割り方の例をいくつか挙げます。

#斜めの割り線

サイズをa~bと書くと、割り線が斜めになります。区画の奥側の辺が、交差する軸の始まりではa%、もう一方の端ではb%の位置を通ります。横に並ぶコマでは始まりは上なので、40~55 | *は上端で幅の40%、下端で55%の位置を結ぶ線を引きます。段では、始まりは読み始める側です。サイズは両端でそれぞれ別に足し合わされ、区画は凸多角形のまま保たれます。角の丸みは長方形のコマにだけ付き、斜めのコマの角は尖ったままです。

#間白

間白は各割り線をまたいで両側に半分ずつ取るので、30%の位置に書いた線は区画のちょうど30%の位置に来ます。斜めの線もその向きの間白を保ち、幅は線に垂直に測ります。既定値は一般的なページに合わせてあり、段の間が4mm、段の中のコマの間が2mmです（comics.gutter.horizontalとvertical、またはページのgutter属性）。

#裁ち落とし

裁ち落としのコマは枠の外へ出ます。枠に接する各辺を仕上がり線まで、ページに塗り足しがあれば（page.cutLines.bleed）さらにその外まで伸ばします。ページのbleed属性はすべてのコマを、コマ自身のbleedはそのコマだけを裁ち落としにします。bleed="top start"は指定した辺（top、bottom、start、end、left、right）だけを伸ばし、bleed=falseは裁ち落としにしません。bleed: trueを持つコマのスタイルは、そのスタイルのコマを裁ち落としにします。

#コマの余白と乗せゴマ

padはコマを区画より小さくします。値は1〜4個で、CSSのマージンと同じ順に論理的な辺（上、終わり、下、始まり）に対応し、それぞれ長さか区画に対する割合です。::panel{art=x pad="0 15%"}は、段より幅の狭いコマを段の中央に置きます。

inset="x y w h"を持つコマは区画を取らず、直前のコマの上に、そのコマの箱に対する割合で指定した位置と大きさで乗ります。隅に入れる小さな顔のアップや、引きの絵に重ねる寄りの絵がこれにあたります。台本はその乗せゴマの中に写植されます。

:::page{split="*"}
::panel{art=storm-wide}
caption{at=bottom-start}: 真夜中、嵐が来た。
::panel{art=maya-window inset="62% 6% 32% 30%"}
maya{whisper}: おじいちゃん？
:::

#コマと絵

::panel{…}の行がコマを始め、その台本は次の::panelの行か閉じのフェンスまで続きます。artのないコマは背景色だけの空のコマとして描かれ、文字だけのコマはこうして作ります。最初の::panelより前にある文字は最初のコマのナレーションとして写植され、comicStrayTextとして報告されます。

#コマに合わせた絵のトリミング

コマの絵は、最終的に入る区画の形を考えずに描かれます。ページの割り方を変えることも、割り線をドラッグすることもあり、翻訳で段を高くする必要が出ることもあるからです。見えていなければならない部分は、絵のセーフエリア（Resource.safeArea。文書形式 › セーフエリアを参照）が示し、トリミングは区画ごとに計算されます。

1. fit=coverでは、表示する窓は区画と同じ縦横比で、絵が許すかぎり大きく取ります。
2. 窓は、セーフエリアがその中に入るように置きます。それでも位置を選ぶ余地があるときは、コマがfocusを指定していればその点を窓の中央にし、指定がなければセーフエリアの外の余白をその大きさに比例して切ります。そのため、中央より左にいる被写体は中央より左に残ります。
3. 区画の縦横比の窓にセーフエリアが収まらないとき（縦長の被写体に対して極端に横長の区画など）は、セーフエリア全体が見えるように絵を表示し、区画の残りをコマの背景色で埋めます。ページはcomicPanelLetterboxを報告します。W × Hの絵のセーフエリアが区画に全部収まるのは、区画の幅と高さの比がsw·W/HからW/(sh·H)の間にあるときです。swとshは、セーフエリアの幅と高さを割合で表したものです。

セーフエリアのない絵は、中央かfocusを中心にトリミングされます。固有のサイズのないSVGは、そのまま区画を埋めます。レンダラーは区画の多角形でクリップし、絵全体をトリミング前の大きさで描くので、トリミングで画像が再サンプリングされることはありません。

#コマのスタイル

コマの見た目は、comics.panel（黒の1ptの枠線、白の地、cover）、ページやコマがstyle=で選ぶcomics.panelStylesの名前付きスタイル、そしてコマ自身のborderとbgで決まります。枠線はsolid、none、roughから選べます。roughは少し揺れる手描き風の線で、揺れはコマから決まるシードで作るので、何度組んでも同じ形になります。すべての項目は設定 › 漫画にあります。

#枠からはみ出す絵

人物や物がコマから飛び出して枠線を破る表現には、絵が2枚要ります。ふつうどおり区画でクリップされるコマの絵と、はみ出す部分を透明な地に切り抜いた絵で、後者はpopで指定します。切り抜きはコマの絵とまったく同じようにトリミングして置き（絵と同じ大きさの画像にしてください）、枠線の後にクリップせずに描くので、枠線と間白の上に重なります。

::panel{art=gull-sky pop=gull-cutout bleed="top"}
sfx{at="70% 20%"}: ギャアッ

#写植

各::panelの行の下には、そのコマの台本を1行に吹き出し1つずつ書きます。

key{attributes}: text

キー（key）は話者のID（英字、数字、_、.、-）で、どの言語の版でも同じです。絵のアンカーや登場人物と対応します。予約されたキーが3つあります。caption（ナレーションの箱）、sfx（描き文字。吹き出しはありません）、note（編集部の注）です。コロンは、中国語や日本語の入力方式で入力される全角の：でもかまいません。テキストはインラインのMarkdownです。*強調*と**強い強調**は写植の慣習どおりボールドイタリックで印字され（イタリックのない文字体系ではボールドだけ）、:tcy[12]は縦の行の中で数字を縦中横にし、:rubyは読みを親文字の上（縦書きでは横）に半分の大きさで組み、:ltrと:rtlは逆向きの吹き出しの中で一部の文字列を本来の向きのまま保ちます。スペース2つかタブで字下げした行は、上の吹き出しの続きです。前の行とはスペースでつなぎますが、中国語や日本語の2文字の間には何も入れません。行末のバックスラッシュは、そこで吹き出しの文字を改行します。空行は無視され、台本の形になっていない行はナレーションとして写植されてcomicStrayTextとして報告されます。

::panel{art=lh-radio}
tomas: ちょうどよかった。
  無線が聞こえなくなってな、\
  嵐が近づいとる。
biscuit{to="40% 70%"}: ニャ？
note: 真空管ラジオは、声が出るまで1分ほど温めなければならない。

台本の行の属性は次のとおりです。

#吹き出しのでき方

写植は、テキストフレームの流儀ではなく、漫画の写植の習慣に従います。

• 本全体で1つのサイズ。どの吹き出しもcomics.lettering.fontFamilyで、comics.lettering.fontSize（既定は7.5pt）の大きさに組みます。変わるのはスタイルのfontScaleによる倍率だけです（ささやきは0.9、叫びは1.15）。収めるために文字を縮めることはありません。収まらない吹き出しは形を変えるか、移動するか、枠線を越えるか、報告されます。
• 先に文字、後に吹き出し。まず語を行に分けます。目指す形は菱形で、上と下の行を短く、中ほどの行をいちばん長くし、最後の行がほかの行より極端に短くならないようにし、同じくらいよい改行位置がほかにあれば冠詞や前置詞で行を終えません。その後、行の周りに、どの側にも同じだけの余白を取って輪郭を描きます。
• 表記の決まり。ピリオド3つは三点リーダーになります。textTransform: 'uppercase'は文字をすべて大文字にします（大文字のない文字体系はそのままで、ドイツ語のßはSSになります）。日本語と中国語では吹き出しの最後の句点を省き（dropFinalStop）、縦書きではASCIIの!と?を全角の形にし、2つ続くときは1マスに収めます（!?は⁉）。doubleDashは、アメリカのコミックのように全角ダッシュを--で写植します。
• 配置。コマの吹き出しは読む順にコマの中へ置き、枠線からcomics.lettering.inset（1.5mm）離します。最初の吹き出しは上寄りの始まり側に置き、次の吹き出しは、読む方向にさらに先へ進んでいる場合を除いて、前の吹き出しより高い位置には置きません。吹き出しは絵が示す顔と回避エリア、話者の口、ほかの吹き出しを避け、話者の下ではなく上か横に置かれ、しっぽどうしはなるべく交差させません。角を指定したナレーションと注を最初に、次に固定した吹き出し、最後に残りを置きます。配置は決定的で、同じページからは常に同じ吹き出しが得られます。
• 紙面の内側。写植が仕上がり線の外に出ることはありません。裁ち落としのコマでは、吹き出しはコマのうち枠の内側にある部分にとどまり、断裁で切られることはありません。コマの横の塗り足しに入れるのは、at=で固定したかbreakを付けた描き文字だけです。
• 収まらないとき。きれいに置けない吹き出しは、まず枠線を越え（breakがあるときだけ）、次に回避エリアにかかり（顔には決してかかりません）、さらに幅の広い形や狭い形を試します。狭い区画の長いセリフは区画とほぼ同じ幅に組まれて間白にはみ出し、話者の顔の上に細い柱のように立つことはありません。それでも何かに重なるときは最も害の少ない位置に置かれ、ページはcomicBalloonOverflowを報告して、そのコマと覆っているものを示します。breakやat=の固定で求めた越境はこの問題に数えず、そのときの警告は吹き出しが覆っているものだけを示します。行を短くするか、コマを大きくするか、at=で固定すれば解決します。

#しっぽ

セリフの吹き出しのしっぽは話者の口を、思考の吹き出しの泡は頭を指します（話者とアンカーを参照）。しっぽは輪郭の話者に面した側から出て、少し曲がり、口の手前で止まります。話者のアンカーがトリミングでコマの外に出たとき、または絵にその話者のアンカーがないときは、しっぽはコマの外、アンカーの方向か最も近い枠線の方向を指し、枠線のところで終わります。このような吹き出しは声の聞こえてくる側の枠線の近くに置かれ、しっぽは短くなります。コマを横切る長いしっぽは矢印のように見えるので、しっぽを伸ばす代わりに吹き出しを動かします。to="x% y%"はしっぽを絵の別の点に向け、tail=start（またはtop、bottom、end）はその側のコマの外にいる話者に向けます。ナレーション、注、描き文字にはしっぽがありません。

#吹き出しの連結

同じ話者の行が2つ続くと、話の途中の間を写植で表すときのように、吹き出しがつながります。joinSameSpeaker: 'butt'（既定）では2つの本体が重なって1つの輪郭を共有し、'connector'では細い首でつながり、'none'ではしっぽを1つずつ持つ2つの吹き出しのままです。しっぽを持つのはグループの最初の吹き出しだけです。行ごとにjoinかjoin=falseで指定することもできます。

#描き文字

sfxの行には吹き出しがありません。文字は大きく（写植のサイズの2.4倍）、太字で、文書の言語に合った描き文字用の書体で組まれ、絵の上でも読めるように文字の周りに白い縁が付きます。絵にsfxのアンカー（IDがsfxのアンカー）があればその近くに、なければ顔を覆わない場所に置きます。rotate、size、color、fontで変更でき、atで固定できます。縦書きの写植では1行に縦に組み、長さは5字までです。描き文字は、ページのすべての吹き出しの後に描かれます。

行ごとに組み方向を指定することもできます。漫画の横組みの版で日本語の描き文字を残すときは、その行を縦に組みます。

sfx{vertical size=2.6 font="Dela Gothic One"}: ドン

#写植の設定

comics.letteringは、本全体の書体、サイズ、行送り、色、表記の決まりを持ちます。既定の書体は文書の言語に従い、描き文字の書体も同じです。

どれもGoogle Fontsにあり、ほかの書体と同じように名前で読み込まれます。行の高さが既定のままなら、縦書きの吹き出しと中国語・日本語の吹き出しは行送り1.5で、アラビア語の吹き出しは1.45で組まれます。日本語、中国語、アラビア語の写植はスタイルの指定にかかわらず斜体にならず、アラビア語には字間を付けません。

#登場人物

comics.castは登場人物の一覧です。各人物は、ID（話者のキー）とnameを持ち、任意で、その人物が話す吹き出しのスタイル（balloonStyle。いつもradioで話すロボットなど）、ほかの人物と区別するための文字のcolorと吹き出しのfill、fontFamilyを持ちます。名前は出力が読み手に伝えるものです。HTMLビューアーとリフロー型のEPUBは、各行を「名前：セリフ」の形で印字します。登場人物に載っている話者が、不明な話者として報告されることはありません。

comics: {
  cast: [
    { id: 'maya', name: 'マヤ' },
    { id: 'tomas', name: 'トマスじいさん' },
    { id: 'beacon', name: '灯台のビーコン', balloonStyle: 'radio', fill: { hex: '#e8f4ff', model: 'hex' } },
  ],
}

#吹き出しのスタイル

吹き出しのスタイルは吹き出しの種類で、輪郭、しっぽ、文字を決めます（Sandboxの画面では「フキダシ」と表記しています）。組み込みのスタイルが9つあり、台本の行は波かっこの中に語を1つ書いてスタイルを指定します（ben{whisper}: …）。予約されたキーは名前と同じスタイルを使い（caption:、sfx:、note:）、それ以外の行はspeechか、登場人物に設定したballoonStyleを使います。

comics.balloonStylesで組み込みのスタイルを変更したり、新しいスタイルを加えたりします。組み込みのIDを持つ項目はそのスタイルに重ねて適用され、新しいIDの項目はspeechから始まります。

comics: {
  balloonStyles: [
    { id: 'caption', fill: { hex: '#ffffff', model: 'hex' }, textTransform: 'uppercase' },
    { id: 'shout', burstPoints: 18, burstDepth: 0.3 },
    { id: 'eerie', shape: 'wavy', stroke: { hex: '#5b4a8a', model: 'hex' }, italic: true },
    { id: 'writing', shape: 'none', tail: 'none', fontFamily: 'Caveat', color: { hex: '#3b2a1a', model: 'hex' } },
  ],
}

ghost{eerie}: この家から出ていけ…
caption{at=bottom-end}: 三つ先の通りで。

輪郭はoval（行に合わせた超楕円。roundnessは2.2）、rounded、rectangle、cloud（ふくらみの数は周の長さから決まります）、burst（とげがburstPoints本、深さburstDepth）、wavy、electric、noneです。dashは破線の輪郭を、doubleは二重の輪郭を描き、wobble（0〜1）は輪郭を手描きのように揺らします。同じ吹き出しの揺れはいつも同じです。しっぽはcurved、wedge、bubbles、zigzag、noneです。すべての項目と既定値は設定 › 漫画にあります。

レンダラーは、欧米のレタラーが吹き出しにペンを入れるのと同じ手順で吹き出しを描きます。グループのすべての輪郭をまず2倍の太さで引き、次に塗り、最後に文字を組みます。そのため、連結した2つの本体としっぽは、間に線のない1つの形になります。

#話者とアンカー

しっぽが人物を指し、吹き出しが顔を避けられるのは、絵が人物の位置を教えるからです。ビットマップやSVGのリソースはアンカーを持てます。話者ごとに1つの点を一度だけ書き、セーフエリアと同じく、絵の左上の角からの割合（0〜1）で表します。

const arrive: Resource = {
  id: 'lh-arrive', typeId: 'figure', kind: 'bitmap', createdAt: 0, updatedAt: 0,
  bitmap: { fileId: 'lh-arrive.jpg', format: 'jpeg', width: 1100, height: 733 },
  altText: '黄色いレインコートの少女が、海沿いの小道を灯台へ向かって歩いている。',
  safeArea: { x: 0.2, y: 0.08, width: 0.42, height: 0.82 },
  anchors: [
    { id: 'maya', x: 0.29, y: 0.52, head: { x: 0.27, y: 0.47 }, face: { x: 0.22, y: 0.42, width: 0.12, height: 0.16 } },
    { id: 'biscuit', x: 0.4, y: 0.68 },
  ],
  avoid: [{ x: 0.51, y: 0.09, width: 0.1, height: 0.43 }], // 灯台
};

• idは、台本が使う話者のキー（maya: …）です。IDがsfxのアンカーは、そのコマの描き文字の位置を決めます。
• x、yは口の位置で、セリフの吹き出しのしっぽはここを指します。
• headは、思考の吹き出しの泡が指す点です。未指定なら口と同じです。
• faceは、どの吹き出しにも覆わせない長方形です。これを持たないアンカーには口の上と周りに数em分の保護枠が付くので、輪郭を指定していない顔も吹き出しに覆われません。
• avoid（リソースに書きます）は、吹き出しで覆わないほかの長方形の一覧です。手、話の鍵になる物、看板などに使います。余地がなければ吹き出しが回避エリアにかかることはありますが、顔にはかかりません。

アンカーは絵に対する割合なので、トリミングに合わせて動きます。エンジンは各アンカーをコマのトリミングと反転を通してページ上に写すので、割り線をドラッグしても、割り方を変えても、翻訳しても、しっぽが話者から外れることはありません。トリミングでコマの外に出たアンカーには、しっぽがコマの外のその方向を指します。そうならないように守るのがセーフエリアです。セーフエリアの外にあるアンカーはトリミングで切られるおそれがあるので、作者向けのヒントとしてcomicAnchorOutsideSafeAreaで報告されます。ページのどの絵にも指定がなく、登場人物にもいない話者のキーはcomicUnknownSpeakerとして報告され、たいていはIDの綴り間違いがこれで見つかります。絵にアンカーがまったくないページは何も報告しないので、アンカーなしでも漫画を写植できます。

アンカーと回避エリアは絵に属し、どの言語でも同じです。Sandboxでは、リソースパネルの画像のエディターで指定します。セーフエリアと写植の項目からダイアログを開くと、セーフエリア、話者、回避エリアの3つのモードがあります。絵をクリックするとそこに話者が加わり、口、頭、顔をドラッグで位置に合わせ、横の欄にIDを入力します。絵の何もない部分をドラッグすると回避エリアを描きます。どの印も矢印キーで移動でき（Shiftを押すと大きく動きます）、Deleteで削除でき、ダイアログは独自の取り消しの履歴を持ちます。

#帯漫画

:::stripブロックの中身は漫画のページと同じですが、文章の中に、段幅かページ幅の箱としてコマに割って置かれます。新聞の連載漫画、雑誌の4コマ漫画、散文の本に挟む短い漫画などに使います。

:::strip{split="* | * | * | *" aspect=4 span=page placement=top}
::panel{art=pip-1}
pip: オットー、氷がとけてるよ。
::panel{art=pip-2}
otto{thought}: パン屋だけはやめてくれ…
::panel{art=pip-3}
::panel{art=pip-4}
sfx: ザブーン
:::

splitのない帯漫画は、コマを横に並べます。帯漫画の箱がそのまま枠になり、間白、コマのスタイル、写植は設定のものを使い、裁ち落としはありません。段より高い帯漫画は、キャプションも含めて段の高さに縮められます。帯漫画の後の本文は、インラインの図の後と同じく、layout.inlineResourceGapが求める間隔を空けて、ベースライングリッドの次の行から続きます。縦組みのページでは帯漫画は回転した箱の中に組まれるので、* / * / * / *でaspect=0.25の4コマ漫画は縦の段を上から下へ進み、キャプションは縦組みの行としてその後に続きます。

:::strip{split="* | * | *" width=70% caption="氷の上のピップとオットー。" type=figure id=pip-ice}
::panel{art=pip-1}
::panel{art=pip-2}
::panel{art=pip-3}
:::
 
:ref{id="pip-ice"}のとおり、氷は薄かった。

キャプションには、キャプションスタイルが設定するものがすべて効きます。書体とサイズ、ラベルと本文の色、ラベルの太さと傾き、帯漫画とキャプションの間のアキ、そろえ、背後の帯です。種類に固有のcaptionStyleは、その種類で番号付けした帯漫画に効きます。

VDTでは、帯漫画はtype: 'resource'のブロックで、comicフィールドを持ち、resourceBlockは持ちません。座標はシート上のブロックの箱に対する相対値で、行長より狭い帯漫画や、キャプションの下にある帯漫画は、その箱の内側に置かれます（そのときcomic.frameは箱の角から始まりません）。キャプションはブロック自身のlinesで、キャプションの書体と色で組まれます。stripCaptionは、どの行がキャプションか、その位置、種類と番号、帯を示します。pageComics(page)は、ページの漫画と、その段とフロートにある帯漫画を、すべてシート上の座標に移して返します。

#見開き

:::page{spread}は、1つの割り方の木を向かい合う2ページに広げます。パノラマや、開いた本の全面を使う戦いの場面のためのものです。枠は2つの版面をノドでつないだもので、ノド側の余白は含みません。割り方、間白、トリミングは1ページのときと同じように働き、コマや絵がノドをまたいでもかまいません。

:::page{spread split="25 [* | * | *] / *" bleed}
::panel{art=market-1}
::panel{art=market-2}
::panel{art=market-3}
::panel{art=market-panorama}
caption: 時計塔から見た土曜の市。
:::

見開きは、両半分が向かい合うように偶数ページから始まります。漫画が奇数ページから始まることになる場合は、その前に白ページを1ページ加えます。1ページ目が単独で置かれる本の冒頭でも同じです。左綴じの本では偶数ページは左ページ、右綴じの本（アラビア語、縦組みの日本語と中国語、右から左に読むコミック）では右ページです。各ページには自分の側の半分が載ります。その側に届くコマがノドで切られて入り、ノドをまたぐコマの絵は両方のページに描かれます。裁ち落としのコマは天、地、小口では塗り足しまで伸びますが、ノドでは伸びません。製本で隠れてしまうノドの周りの8mmの帯には何も写植しません。そこに固定した吹き出しは近いほうの側へずれます。吹き出しはそれぞれ中心のあるページに置かれます。

#読む方向

欧米のコミックは左から右に読み、段の最初のコマは左にあります。マンガとアラビア語のコミックは右から左に読みます。Postextはcomics.readingDirectionから方向を決めます。

• 'auto'（既定）：版の言語の向きに従います。右から左に書く文書では右から左になるので、アラビア語版ではページの配置が左右反転します。縦組みの文書と、日本語および繁体字中国語（ja、zh-Hant、zh-TW、zh-HK、zh-MO）の文書でも右から左になるので、欧米のコミックの日本語版はマンガと同じく右から左に読みます。そのほかの言語では、簡体字中国語と韓国語を含め（現在の中国と韓国のコミックは左から右に読みます）、絵が描かれた向きであるcomics.artDirection（既定は'ltr'）に従います。artDirection: 'rtl'のマンガはどの言語でも右から左です。
• 'ltr'か'rtl'は本全体の方向を固定し、ページのdirection属性はそのページの方向を固定します。

綴じはコミックの向きに従います。page.binding: 'auto'のとき、comicsセクションが右から左に読む本は右綴じになります。1ページ目は背の左側に単独で置かれ、見開きは[3 | 2]の順に並び、ビューアーは左方向にページをめくり、PDFは右から左のページ順を指定し、EPUBは右から左のページ送りを宣言します。決めるのは本全体のcomicsセクションなので、コミックのページがない章もほかの章と同じ綴じになります。ページ自身のdirectionで背の位置は変わりません。comicsセクションがなく、コミックのページが既定値を使う文書は、本文の綴じのままです（comics: {}と書けば、コミックの読む向きに合わせて綴じます）。page.binding: 'left'または'right'を明示した場合はそれが優先されます。綴じを参照してください。

同じソースから両方のページ配置が得られます。右から左のページでは各段のコマを右から並べるので、コマ1は右上に来ます。斜めの線もそれに合わせて反転し、bleed、pad、角を表すキーワードの論理的な辺も同様です（top-startのナレーションは右上に来ます）。段の順は上から下のままで、台本の読む順も変わりません。写植の規則も反転します。コマの最初の吹き出しは右に寄り、次の吹き出しが前より高い位置に来られるのは、さらに左にある場合だけです。

絵は、指定しないかぎり反転しません。comics.mirrorArt: trueは、artDirectionと逆の方向に読むページの絵をすべて左右反転します。かつて欧米で出版されたマンガが長く行っていたやり方です。::panel{mirror=false}は絵を描いたままにします（絵の中に描かれた文字、右利きの剣士など）。アンカーとセーフエリアも反転に従います。反転はふつう使わないほうがよいでしょう。コマの順序はすでに読者に合わせてあり、反転した絵は作者が描いたものを変えてしまいます。

吹き出しの組み方向は、コマの順序ではなく言語に従います。comics.lettering.writingMode: 'auto'では、日本語と繁体字中国語は右から左へ行を進める縦書きで写植されます。1行は最大maxColumnChars字（8字）で、日本語の禁則処理に従い、数字は:tcyで縦中横にし、約物は縦書き用の形になります。縦組みで組む文書は、どの言語でも縦書きで写植されます。簡体字中国語、韓国語、その他の言語は横書きで写植され、'horizontal'か'vertical'でどちらかに固定できます。アラビア語は右から左に写植し、ラテン文字の語と数字はそれぞれ本来の方向で組み、斜体にも字間にもしません。

#漫画の翻訳

翻訳は、同じ:::pageと::panelの行、同じ話者のキーを持ち、言葉だけが違うMarkdownファイルです。絵とそのセーフエリア、アンカー、回避エリア、割り方、固定位置（at=の点は絵に対する割合です）は、すべての版で共有します。写植は版ごとに行われます。文字はその版の言語と書体で測られ、その言語の行に分けられ、吹き出しはすべてその周りに形を作り直して置き直されます。たとえば、上の最初のページの英語版は次のようになります。

:::page{split="30 [30 | 20 | *] / *"}
::panel{art=lh-arrive}
caption: Every summer, Maya spent a week at the lighthouse.
maya: Grandpa! I'm here!
::panel{art=lh-radio}
tomas: Just in time. The radio's gone deaf,
tomas: and there's a storm on the way.
:::

版ごとに変わるものは、文書のlocaleから決まります。既定の写植と描き文字の書体、日本語と繁体字中国語の縦書き、中国語と日本語の句点の省略、行送り、アラビア語版のページの方向です。文章はスペイン語やフランス語では英語よりおよそ5分の1長くなり、中国語や日本語ではずっと短くなります。吹き出しはそれに合わせて大きくも小さくもなり、comicBalloonOverflowが、翻訳で行を短くするか固定が必要なコマを示します。描き文字もほかの言葉と同じです。翻訳するか、元の描き文字を残してその下に小さく訳を添えます。

#漫画の出力

どの出力も同じ漫画を描きます。コマの背景、コマでクリップした絵、枠線、枠からはみ出す絵、次に連結グループごとの吹き出し（輪郭の線、塗り、文字の順）、最後に描き文字です。

• Canvas。SandboxのCanvas、Folioの3Dのページ、サムネイルは、すべてrenderPageToCanvasで描きます。
• PDF。postext-pdfは漫画のページの輪郭をベクターで描き、写植の書体を埋め込みます。PDFの印刷用マスター（svg.pdfFileId）を持つSVGの絵は、そのマスターとして埋め込みます。タグ付きPDFでは、漫画の各ページがDiv、各コマが代替テキスト（コマのalt、なければリソースのaltText）付きのFigureになり、各吹き出しはそのコマのFigureの後に読む順に並ぶPになります。描き文字は、その語を/ActualTextに持つSpanです。背景、枠線、輪郭はアーティファクトです。出力はveraPDFのPDF/UA-1の検査に通ります。
• HTML。各コマは、インラインのSVG（クリップ、絵、枠線、切り抜き）とコマの代替テキストを持つ<figure>で、その後に吹き出しが読む順に<p>要素として続きます。セリフの吹き出しは視覚的に隠したspanの話者名で始まるので、スクリーンリーダーは「マヤ：おじいちゃん！来たよ！」と読み上げます。描き文字は、その語をラベルにした画像として読み上げられます。SandboxのHTMLビューアーのページは画面の幅とスクロールする高さを持つので、漫画のページは印刷のページをビューポートに合わせて縮小した形で組み（comics.viewerLeaf）、リフローはしません。
• 固定レイアウトのEPUB。ページは印刷版と同じです。本には領域ベースのナビゲーション（regions.xhtml、EPUB Region-Based Navigation 1.0）も入ります。読む順にコマごとに1つのpanel領域があり、その中に吹き出し、ナレーション、描き文字が入るので、リーディングシステムはコマ単位で本を読み進められます。ページ送りの方向は漫画の読む方向に従います。renderToEpubのオプションkindlePanelView: trueはKindleのパネルビューを加えます。コマごとのタップ領域と、画面いっぱいに拡大した複製を、Kindleが求めるメタデータとともに入れます。
• リフロー型のEPUB。ここには保つべきページがないので、各コマはページと同じようにトリミングした絵になり、その後にセリフがテキストとして続きます。「マヤ：おじいちゃん！来たよ！」の形で、ナレーションは段落として、描き文字は斜体で入ります。

帯漫画のキャプションは、図のキャプションと同じく本文とともに描かれます。タグ付きPDFでは帯漫画のDivのCaptionになり、コマの後に読まれます（帯漫画の上に置いたときはコマの前）。HTML、固定レイアウトのEPUB、リフロー型のEPUBでは、帯漫画とそのキャプションが1つの<figure>になり、キャプションはその<figcaption>です。縦組みや右から左のページでは帯漫画の絵がシートの上に重ねて置かれるので、HTMLではキャプションを本文の中に単独で残します。

#Sandboxでの漫画の編集

Canvas、HTMLのページ、Folioのテキストを選択モードでは、漫画のページをポインターで編集でき、どの編集も章のMarkdownに書き戻されます（詳しくはSandboxのガイドを参照）。

• 割り線。間白の上ではポインターがサイズ変更のカーソルになります。ドラッグすると割り線が動き、離すと新しい割合がページのsplitの値に書き込まれ（ページにこの属性がなければ加えます）、ページが組み直されます。Shiftを押すと5%刻みになり、Altを押すと近い側の端だけが動いて線が斜めになります。5%より狭くなる区画はありません。ドラッグ中は、絵が全体表示になってしまうコマに印が付きます。各割り線はフォーカスできる区切りでもあり、矢印キーで1%（Shiftで5%）動かし、Enterで位置を書き込み、Escapeで元に戻します。
• コマ。コマの上の小さなツールバーで、コマを横線か縦線で分割すると、新しい区画のための空の::panelがそのコマの後に加わります。次のコマと結合すると割り線がなくなり、結合したコマは最初のコマの絵と、両方の台本を持ちます。
• 吹き出し。吹き出しをドラッグすると固定されます。台本の行に、コマの絵に対する割合でat="x% y%"が付きます。連結したグループは一体で動きます。動かしている間、顔か回避エリアを覆う位置やコマからはみ出す位置では吹き出しがオレンジ色になり、ツールチップがどれに当たるかを示します。フォーカスのある吹き出しは矢印キーで1%ずつ動き、固定した吹き出しをダブルクリックすると固定が外れます。
• しっぽ。しっぽの先をドラッグすると、しっぽが指す点がto="x% y%"として行に書き込まれます。先をダブルクリックするとtoが消え、しっぽは話者に向き直ります。フォーカスのある吹き出しからTでしっぽに移り、矢印キーで指す点を動かします。
• キーボード。フォーカスのあるコマは、Hで横線、Vで縦線で分割し、Mで次のコマと結合します。
• 帯漫画。どのツールも:::stripのブロックで使えます。段の中、フロート、ページ幅のどれでも、行長より狭くてもキャプションの下にあっても同じで、書き込み先は帯漫画自身のフェンスです。
• 絵。絵のセーフエリア、話者、回避エリアはリソースパネルで指定します（話者とアンカーを参照）。
• 設定。デザインパネルのマンガグループに、読む方向、枠と間白、既定のコマとコマのスタイル、写植、吹き出しのスタイルがあり、それぞれにプレビューが付きます。
• エディター。テキストエディターは:::page、::panel、台本の行に色を付け、検査パネルは漫画の警告をその行の位置に一覧表示します。

#漫画の警告

どの警告も対象の行か属性を示し、Sandboxの検査パネルは、1列目の題で警告をその位置に一覧表示します。

警告は、対象の行か属性のソース範囲とともに、文書のcontentWarningsに返ります（設定 › 文書の中の警告を参照）。

吹き出しのスタイルのshape: 'ovl'やreadingDirection: 'rlt'のように、いくつかの語のうち1つを取る漫画の設定に別の値が入っていると、その設定は既定値として読まれ、検査パネルに不明な設定値（unknownConfigValue）として、エンジンが使った値と最も近い語とともに表示されます。検査する設定は、readingDirection、artDirection、コマのスタイルのborderStyleとfit、写植のwritingMode、textTransform、dropFinalStop、joinSameSpeaker、吹き出しのスタイルのshape、tail、target、position、align、textTransformです。

#プログラムからの利用

漫画に必要なのはbuildDocumentだけです。リソースが絵とそのセーフエリア、アンカー、回避エリアを持ち、設定が必要に応じてcomicsを持ちます。写植は読み込んだフォントで文字を測るので、ほかの書体と同じく、写植の書体はレイアウトの前に読み込んでおく必要があります。comicFontFamilies(config, markdown)は文書の漫画に必要な書体（写植の書体と、すべての吹き出しのスタイルと登場人物の書体）を一覧にし、markdownHasComics(markdown)はテキストに漫画のページか帯漫画があるかどうかを返します。PDFでは、フォントプロバイダーがほかの書体と同じようにそれらの書体を求められます。

組まれた漫画はVDTにあります。page.comic（VDTComicPage）は、枠、読む方向、読む順に並んだコマ（多角形、枠線、背景、art.sourceとart.boxとしての絵のトリミング）、割り線（書き込み先のsplitの値のソース範囲付き）、吹き出し（輪郭のパス、テキストのブロック、しっぽの先、種類、話者）を持ちます。割り方の文法はエディターのためにエクスポートされています。parseComicSplit、serializeComicSplit、moveComicSplitLine、splitComicCell、mergeComicCellsはsplitの値を読み、書き換え、できるかぎりその中の*を保ちます。comicArtCropとcomicCropFeasibleRangeはトリミングを計算し、comicArtPointToPageは絵の上の点をページ上に写します。

#既知の制限

• 割り方は木だけ。割り方は各区画を、区画を横切る線で2つに分けるので、ページ全体を横切る線のないレイアウトは書けません。たとえば、5つ目のコマの周りを4つのコマが風車のように囲む形です。そうしたレイアウトでやりたいことの多くは、乗せゴマと枠からはみ出す絵で表せます。
• コマの形。コマは凸多角形です。円形やぎざぎざのコマ、枠線のないぼかしのコマ、回転や拡大をした絵、スピード線は、Postextではなく絵の中に描きます。
• 写植。右から左に読む親文字にはルビを付けず、そのほかの注記は吹き出しの中ではプレーンテキストとして印字されます。配置はコマごとに行います。しっぽの交差はコストで避けるだけで、互いを迂回する経路は引かず、コマからコマへの流れの釣り合いも取りません。ごく小さな区画の長いセリフは報告するだけで、解決はしません。指定のない顔の保護枠は口と頭の点から大きさを決める（アンカーに頭がなければ数em）ので、顔のアップでは顔全体より口を守ることがあります。顔を指定してください。
• 帯漫画は、ページ全体に満たない数の段にまたがることはできず（3段のページでcolumns=2）、章の最上位でだけ読まれます（囲み、表、脚注の中では読まれません）。帯漫画のキャプションの中の文献の引用は、書いたとおりに印字されます。
• 見開き。ノドで切られた角丸のコマは、丸い角をすべて失います。左綴じの本に入れた右から左に読む漫画も左ページから始まるので、最初のコマが見開きの2ページ目に来ます。
• 枠からはみ出す絵はコマの絵のトリミングを使うので、切り抜きは絵と同じ大きさでなければなりません。
• 出力。altもaltTextもないコマの代替テキストは、英語の「Panel N」です。領域ベースのナビゲーションは、斜めのコマをその外接矩形で表します。Kindleのパネルビューはページの漫画をコマの数だけ複製するのでファイルが大きくなり、Kindle Previewerでの確認はまだです。

#出典

• Nate Piekos、Comic Book Grammar & Tradition（Blambot）：吹き出しの種類、ナレーション、強調、ダブルダッシュ。
• John RoshellとComicraft、Balloon Tales：しっぽと連結、および輪郭を引いてから塗るレイヤー法。
• Todd Klein、Digital lettering for comics。
• David Kurlander、Tim Skelly、David Salesin、Comic Chat、SIGGRAPH 96：読む順に沿った吹き出しの配置。
• IDPF、EPUB Region-Based Navigation 1.0、Amazon KDP、Kindle Panel View。