Mozilla SVG Project

はじめに

ここに辿り着いたあなたは、SVG とは Scalable Vector Graphics のことであり、それが高度な 2 次元グラフィックのための XML 言語であることはおそらくすでにご存知でしょう。SVG とグラフィックとの関係は、XHTML とテキストや MathML と数式の関係、あるいは CML と化学分子の記述との関係と同じようなものです。

SVG の守備範囲は、Adobe 独自の Flash テクノロジに似ています。例えばアンチエイリアス描画、パターンとグラデーション、高度なフィルタ効果、任意のパスでのクリッピング、テキスト、そしてアニメーションといった機能が提供されています。SVG が Flash と一線を画している点、それは SVG が W3C の勧告 (つまりれっきとした標準) だということ、そしてそれが閉鎖的なバイナリ形式ではなく XML ベースのフォーマットだということです。SVG は、CSS や DOM、SMIL といった他の W3C 標準と連携して利用することを念頭に置いて設計されているのです。

簡単な例

SVG がどんなものかご覧になりたい方のために、簡単な例をここに示しました:

<svg xmlns="https://www.w3.org/2000/svg"
     xmlns:xlink="https://www.w3.org/1999/xlink"
     version="1.1"
     baseProfile="full">
  <g fill-opacity="0.7" stroke="black" stroke-width="0.1cm">
    <circle cx="6cm" cy="2cm" r="100" fill="red"
                    transform="translate(0,50)" />
    <circle cx="6cm" cy="2cm" r="100" fill="blue"
                    transform="translate(70,150)" />
    <circle cx="6cm" cy="2cm" r="100" fill="green"
                    transform="translate(-70,150)" />
  </g>
</svg>

こちらはそれを Mozilla Firefox 1.5 で表示させたものです:

ネイティブ SVG 対プラグイン SVG

Mozilla の SVG は、ネイティブな SVG の実装です。ここは Adobe のビューア (現在もっとも普及している SVG ビューア) のようなプラグイン型の SVG ビューアとは大きく異なっているところです。

その意義としては以下のような点が挙げられます:

Some of the implications of this are:

• Mozilla は、SVG や MathML、XHTML、XUL などが混在するドキュメントを単一の「複合」ドキュメントとして扱うことができます。これは XML 名前空間 を利用することによって実現されます。
• SVG コンテンツの存在を Mozilla が「認識」します。したがって SVG DOM (XML DOM 互換の仕様) を利用して、Mozilla のスクリプトエンジンから SVG コンテンツにアクセスしたり操作したりすることが可能です。
• SVG を他の Mozilla テクノロジと組み合わせて利用することができます。特に興味深いのは、XBL と SVG との組み合わせでしょう。この方法でグラフィカルなウィジェットを作成したり (SVG ベースの chrome が登場する日も遠くないはずです！)、Mozilla を拡張して CML (chemical markup language) などの別の専門的な言語を認識できるようにすることが可能です。このような高度な利用パターンの例のいくつかは、croczilla.com/svg/ にあります。

現状

SVG サポートは Mozilla Firefox の最新版に含まれています！

私たちが Mozilla の SVG 実装で目指している目標は、SVG 1.1 Full で、現在ツリーにあるものはテクノロジープレビューとして扱われるべきものです。これから仕様をさらに実装していくにあたり、Mozilla の SVG 実装とは異なる内容は壊れる可能性があります。すでに修正されたバグに、気づかないまま依存している場合があるからです。これは望ましい事態ではありませんが、仕様の実装作業を我慢強く見守ってください。この仕様は非常に大規模なのですが、包括的なテストスイートが無いのです。

私たちの目標は仕様への適合です。仕様と他の SVG 実装が異なる場合、仕様を優先します。仕様が不明確な場合、SVG ワーキンググループやその他の専門家に諮り、決断をして情報公開します。

完全な SVG サポートを達成するまでにはまだまだ長い道のりがありますが、現時点で実装済のサブセットもすでにかなり実用的な域に達しています。ベジエ曲線、ストローク、透明度を使ったフィル、グラディエント、スクリプティング、イベントなども含めたすべての基本図形描画と大部分の DOM についてはすでに対応が完了しています。

私たちがまだ取り込めていない SVG 仕様で大きな分野は、フィルタ、SVG によって定義されたフォント、宣言型アニメーションです。SVG 実装と描画バックエンドの現時点での実装状況をまとめたページは Mozilla SVG Status にあります。

参加方法

SVG 1.1 は規模の大きな仕様で、私たちは実装をはじめたばかりです。バグの追跡やテストケースの作成、あるいは重要な機能の実装とちた分野で手助けができそうだと思ったら、連絡をください。

私たちはチャットチャンネルを持っています。irc.mozilla.org 上の #svg がそれです。

さらに Mozilla の SVG の話題に特化したニュースグループ・メーリングリストもあります。mozilla.dev.tech.svg という名前です。

バグを報告する場合、私たちが追跡でき、あなたも進捗状況を確認できるように、Bugzilla にお願いします。「Core」プロダクトの「SVG」コンポーネント に報告してください。テストケース (是非お待ちしています) を持っている場合は、バグのコメント欄に貼り付けるのではなく、Bugzilla の添付機能を使ってください。

ダウンロード

SVG サポートは現在、Mozilla Firefox の最新版と、開発者およびテスター向け ナイトリービルド (すべてのプラットフォームで Cairo 描画バックエンドを使用しています) に含まれています。ほとんどの方はもう特別な「SVG 対応」ビルドをダウンロードする必要はありません。ひとつだけの例外は、あなたが Microsoft Windows 98 以前のバージョンをお使いの場合です。その場合、GDI+ が有効になっている SVG ビルドをダウンロードされることをお勧めします。また、併せて GDI+ をインストーするする必要があるでしょう。

ビルド

もし、何らかの理由で、上記のビルドをダウンロードするのではなく、Mozilla 製品の独自バージョンを SVG サポート付きでビルドしたい場合は、[[Building Mozilla with SVG Support|Mozilla+SVG ビルドページ] を参照してください。

よくある質問

私たちに直接尋ねる前に、FAQ を参照して、あなたの質問の答えが載っていないか確認してください。それでも答えが見つからない場合は、ニュースグループ や IRC チャンネル でお尋ねください。

リンク

Mozilla 特有の SVG サイト

• Mozilla SVG リソース
• Mozilla SVG サンプル

一般的な情報源

• W3C の SVG サイト
• Jonathan Watt の SVG 記述ガイドライン - これらのガイドラインに従って、あなたの SVG をすべての SVG 実装で動作するようにしましょう。
• SVG wiki
• Mozilla Developer Center の SVG セクション
• SVG に関する一般的な質問用に、[email protected] でメーリングリストが運営されています。(アーカイブはこちら)
• もうひとつ参考になり、非常に活発なニュースグループ・メーリングリストは [email protected] です。(アーカイブはこちら)