2011年6月9日木曜日

ePub 2.0 ことはじめ (6) 画像の挿入

の続きです。

HTML で ePub 文書を書けるようになりましたし、目次も作ることができるようになりました。これで、ePub ドキュメントを作成する準備はほとんど整ったと言って良いでしょう。

さて、本エントリーでは ePub での画像の扱いについて書きます。

ePub で画像

画像を挿入するには、HTML の img 要素を使います:

<img src="foo.jpg" alt="サンプル画像" />

ePub が対応している画像は JPEG, PNG, GIF, SVG の四種類です。

content.opf の変更

ePub で画像を入れる際の注意点は、挿入する画像を content.opf に登録しておかなければいけない点です。登録は manifest 要素の中で行ないます。

サンプル・コードです。

<item id="sample-jpg" href="sample.jpg" media-type="image/jpeg" />
<item id="sample-png" href="sample.png" media-type="image/png" />
<item id="sample-gif" href="sample.gif" media-type="image/gif" />
<item id="sample-svg" href="sample.svg" media-type="image/svg+xml" />

ソースとプレビュー

ソースコードは github で見ることができます。

iPad 上の iBooks で各々の画像を表示させてみました:

SVG もちゃんと表示されていますね。良かったです。

SVG 画像の作成

SVG 画像の作成には、graphviz を使いました。ソースコードは data ディレクトリー内にあるので、興味のある方は github で確認して下さい。なお、PNG/JPEG/GIF ファイルは SVG ファイルから convert したものです。

投稿者 時刻:
ラベル:

0 件のコメント:

コメントを投稿

登録: コメントの投稿 (Atom)