http://xml.apache.org/http://www.apache.org/http://www.w3.org/

Home

Overview
FAQ
License
Download
Install
Demo

In the news

Tools and Apps
Browser
Rasterizer
Font Converter
Pretty-printer

Architecture
Generator
DOM API
Scripting
JSVGCanvas
Transcoder API

Extensions

Testing

Contributors
Mail Lists

CVS Repository
Bug Database

Status

Glossary



ブラウザのダウンロード

ダウンロード エリア を参照し、Batikをダウンロードする方法を見てください。開発者用ディストリビューションとバイナリディストリビューションのどちらも入手可能であることを忘れずに。

Batikダウンロードをあなたのシステムにインストールする方法をインストールのページ で参照してください。


ブラウザの起動

ブラウザの起動方法は、あなたがダウンロードしたBatikのディストリビューションによります。以下では、それぞれのディストリビューションについての、ブラウザの起動方法を説明します

バイナリ ディストリビューションでのブラウザの起動

もしあなたがBatikのバイナリ ディストリビューションをダウンロードしたのであれば、あなたはbatik-1.1.zipと呼ばれるファイルを入手しているはずで、これを展開すると、batik-svgbrowser.jar ファイルが生成されます。ブラウザを開始するには、以下のコマンドラインを打ってください:

cd <installationDirectory>

java -jar batik-svgbrowser.jar

コマンドラインにオプションを渡すことも出来ます:

java -jar batik-svgbrowser.jar [-font-size <fontSize>] [svgURL]*

ここで:

  • -font-size <fontSize> はGUIで、ブラウザがスモール フォントを使用するようにします。
  • [svgURL]* は、起動時にブラウザが開くべきSVGファイルのURLとなります

たとえば:

  • java -jar batik-svgbrowser.jar -font-size 10 は、ブラウザをスモール フォントで起動します
  • java -jar batik-svgbrowser.jar -font-size 10 samples/batikLogo.svg は、ブラウザで batikLogo.svg ファイルをオープンして起動します(そして、-font-sizeによって、スモール フォントとなります)

開発者ディストリビューションでのブラウザの起動

もしあなたがBatikの開発者ディストリビューションをダウンロードしたのであれば、解凍したzipまたはtarファイルをxml-batikディレクトリに落としたとします。このディレクトリで、あなたは実行しているプラットフォームに合ったビルド スクリプトを見つけることが出来ます。たとえば、Windowsプラットフォームのユーザーのためのスクリプトはbuild.batですし、UNIXユーザーのためのスクリプトはbuild.shです。

プリティ プリンタを起動するには、あなたがしなければならないことは:

  • xml-batikディレクトリがあなたのPATH環境変数に含まれていることを確認してください
  • ANT_HOME環境変数がxml-batikディレクトリにセットされていることを確認してください
  • JAVA_HOME環境変数があなたのJDKのインストレーション ディレクトリにセットされていることを確認してください
  • コマンドライン ウィンドウを開いて、Batikディストリビューションが解凍されたxml-batikディレクトリに移動してください
  • UNIX ユーザーは、もしまだ未設定であれば、build.shスクリプトを実行可能にしてください:
    chmod +x build.sh
  • コマンドラインから打ってください:
    Windows: build svgbrowser.
    UNIX: build.sh svgbrowser.
    これはブラウザのヘルプメッセージを出力します。

次のように、ブラウザにオプションを渡すこともできます:

Windows: build svgbrowser [-font-size <fontSize>] [svgURL]*

UNIX: build.sh svgbrowser [-font-size <fontSize>] [svgURL]*

これらのオプションについての説明は、"バイナリ ディストリビューションでのブラウザの起動" を参照してください。ちなみに、Windowsではバッチファイルが最大で9までしかとれないため、コマンドライン引数で渡して開くことができるファイルの数が限られていることに注意してください。


SVG ブラウザのスクリーンショット

次のイメージは、バイナリ ディストリビューション、開発者ディストリビューションに関わらず、-font-size 10 samples/batikFX.svg オプションを付けてブラウザを起動した結果を示しています。

Batik ブラウザ



SVG ドキュメントの表示

このブラウザには、SVGドキュメントを表示しブラウズするための、様々な機能が備わっています:

ローカルのSVG ファイルを開く

SVGファイルを、Batik SVGブラウザを実行しているローカルマシン上に持っている場合は、あなたはファイルを開くための"File->Open File" メニューを使ったり、あるいは"Ctrl-F" キー アクセラレータを使うこともできます。そうすると、ファイル選択が開いて、あなたに表示したいファイルを選択するのを促します。

SVG ブラウザのファイル オープン


WebからSVGファイルを開く

表示したいSVGコンテンツが、ブラウザの稼働しているマシンのローカルにないという状況はよくあることです。このような場合には、"File->Open Page" メニュー項目を使うか、あるいは"Ctrl-O" キー アクセラレータを使って、そのページをオープンすることが出来ます。そうするとダイアログ ボックスが開くので、あなたが表示したいファイルのURLをタイプします。

SVG ブラウザでページをオープンする


SVG ファイルを表示するのにロケーション テキスト フィールドを利用する

もしあなたが表示したいドキュメントのURLを知っていれば、SVGブラウザ中のロケーション バーのテキスト フィールドに、直接タイプすることも出来ます。HTMLブラウザで直接URLをタイプできるのと同じです。

SVG ブラウザのロケーション バー


SVGファイルのブラウジング

HTMLコンテンツと同様に、前後のSVGファイル間をナビゲーションするのは一般的です(SVGファイルがHTMLと同様のハイパーリンクをもっていることを思い出してください)し、この文書で後述するように、SVGドキュメント中にズームし、パンし、回転させることも可能です。

SVG ファイルのブラウジング

Batikブラウザは、あなたがSVGファイルをブラウズするのを助けてくれる、複数の機能を備えています:

  • ファイル間をナビゲートする。"Go->Back" メニュー項目(あるいはCtrl-left 矢印キーボード アクセラレーション) と "Go->Forward" (あるいはCtrl-right 矢印キーボード アクセラレーション)は、あなたがそれ以前あるいはそれ以降に訪問したSVGドキュメントに移動させてくれます。
  • 履歴。 "Go" メニューには、あなたが訪問したSVGドキュメントのリストも含まれており、その中の任意のドキュメントにランダムにアクセスすることが出来ます。
  • ビュー間のナビゲーション。"View->Previous Transform" メニュー項目 (Ctrl-L) および "View->Next Transform" メニュー項目 (Ctrl-N) では、あなたが見たドキュメントのビューのそれ以前あるいはそれ以降に行くことが出来ます。これはたとえば、あなたがドキュメントをパンあるいは回転させた後に、あなたが見た任意の以前のビュー(つまりあなたが以前パンあるいは時点)に戻りたい場合に便利です。

複数のSVGファイルを表示する

複数ファイルを表示する

Batik SVGブラウザは複数のファイルを同時に別のウィンドウに表示することが出来ます。新しいファイルを別のウィンドウに表示するためには、単純に "File-> Create New Window" メニュー項目を選択するか、Ctrl-N キーボード アクセラレータを使用します。


SVGドキュメントのリロード

SVGドキュメントで作業しているとき、あなたはブラウザで変更したドキュメントをやり直させたいと思うかもしれません。"File-> Reload Document" メニュー項目あるいは Ctrl-R キーボード アクセラレータが、ブラウザでドキュメントをやり直させてくれるでしょう。



SVGドキュメントをエクスポート・印刷する

"File->Print" メニューが選択されると、現在表示されているSVGドキュメントを印刷します。

"File->Export As" メニューは、現在表示されているSVGドキュメントを、さまざまなラスター フォーマットでエクスポートさせてくれます。現在、このブラウザではPNG, JPEG, TIFF の各フォーマットをサポートしています。


SVGソースのインスペクト

ブラウザはSVGドキュメントのソースをインスペクトする2つの方法を提供します: プレーン ソースの表示と、ドキュメント ツリーの表示です。どちらもこれから説明します。

ソースを表示する

ソースコードを表示する

ブラウザがSVGファイルを表示していると、"View-> View Source..." メニュー項目を選択したり、Ctrl-U キーボード アクセラレータを使って、ソースコードを表示することが出来ます。


ドキュメント ツリーの表示

ドキュメント ツリーを表示する

ブラウザがSVGファイルを表示していると、"View-> DOM Viewer..." メニュー項目を選択したり、Ctrl-T キーボード アクセラレータを使って、SVGドキュメントをツリーの形式で表示するダイアログを開きます。このダイアログは、ツリーをナビゲートし、パス要素のような個々の要素を選択し、あるいは属性やその要素に適用されるCSS値を表示するといったことをさせてくれます。



SVGブラウザの動作設定

"Edit->Preferences" メニュー項目は、以下の図に示されるようなダイアログ ボックスを開きます。

SVGブラウザの動作設定

このダイアログには様々な種類のオプションが含まれており、左側のリストから選択できます。それぞれのオプションについて、パネルがさまざまなブラウザ パラメータを設定させてくれます:

  • Network オプション パネル。このパネルは、あなたがファイアウォール越しに作業している場合に使用するproxyサーバを設定させてくれます。
  • Languages パネル。これは図に示されているパネルです。あなたの言語を選択させてくれます。ユーザー言語はSVGドキュメント中で代替コンテンツを選択するために用いられます。たとえば、samples/moonPhases.svg の例を開いてください。それから、あなたの言語をフランス語に変更してドキュメントをリロードしてください (Ctrl-R)。今度はテキストがフランス語で表示されているのが見えることでしょう。同じ事が日本語についでも可能で、日本語で表示されることになるでしょう。
  • Browser Options パネル。このパネルはいくつかのオプションの振る舞いを選択させてくれます:
    • Show Rendering。これがonになっていると、ブラウザはSVGドキュメントの処理中にキャンバスをアップデートします。これは段階的なレンダリングをonにします。
    • Auto Adjust Window。これがonになっていると、ブラウザ ウィンドウは新しくロードされたドキュメントに合うようにリサイズされます。
    • Enable Double Buffering。これがonになっていると、ブラウザはズームやパンといったエフェクトの品質を向上させるために、追加のメモリ リソースを利用します。
    • Show debug traces。これがonになっていると、標準出力にデバッグ メッセージが出力されます。これは開発者のみに向けた機能です。
  • Stylesheet パネル。このパネルは、SVGドキュメントを表示されるときのデフォルト設定のいくつかを上書き設定できるような、ユーザー スタイルシートを指定させてくれます。たとえば、もしあなたがテキスト要素のフォントサイズを上書き設定したい場合には便利です。

SVGドキュメントのナビゲーション: ズーム、パン、回転、変形、サムネイル

The Batik browser offers multiple way to navigate SVG documents:

ズーム インおよびアウト

SVGドキュメントをズームインまたはアウトする方法はいくつもあります:

  • "View -> Zoom In/Out" メニュー項目を選択することができます
  • "Zoom In/Out" ツールバー ボタンをクリックすることが出来ます ("+/-"のマークの入った虫眼鏡で表示しているものです)
  • "Ctrl+I" および "Ctrl+O" のキーボード アクセラレーションを利用できます
  • もしマウスが表示エリアのドキュメント上にあれば、Ctrlキーを押しながら左マウスボタンをクリックしてから、ドキュメント中の見たいエリアをドラッグで選択できます。これはドキュメント中をズームしたい場合にのみ利用します。
  • もしマウスが表示エリアのドキュメント上にあれば、Shiftキーを押しながら右マウスボタンをクリックしてからドラッグしてみてください。これは「リアルタイム」ズームと呼ばれるもので、ズームインもアウトも行うことができます。

SVG ドキュメントにズーム、イン(福留)

SVG ドキュメントにズーム、イン(巨泉)


ドキュメントのパニング

ドキュメントによっては、ブラウザで表示するには大きすぎるものがあります。特に巨大なズーム倍率でズームインしているときはそうです。そういう場合のために、ドキュメント中を「動き回る」ことができて、そのドキュメントの他の部分の表示にパニング(切り替え)が出来れば便利です。ここでもまた、これを実現する複数の方法が存在します:

  • ドキュメント上にマウスカーソルをもってきて、Shiftキーを押してから左マウスボタンをクリック、ドラッグして新しい場所に持っていってください。マウスを放した時点で、ドキュメントが新しいマウスの位置まで移動するでしょう。
  • もしあなたがサムネイルを開いていれば、カレント エリアを示すマーカーを選択して、お望みの場所へ移動させることが出来ます

SVG ドキュメントにパニングする


ドキュメントを回転させる

ドキュメントを回転させることが出来ると、たまに便利です(例に示す地図など)。Batikブラウザでは、最初にCtrlキーを押して、右マウスボタンをクリックして、新しい場所までドラッグすることで、これが可能になります。このブラウザは、あなたのカーソルの動作に合わせて、動的にイメージを回転させます。あなたがその角度で満足できたら、そこでマウスボタンを放すと、ドキュメントはその新しい角度で表示されるでしょう。


変形ダイアログを使用する

マウスやキーボードのインタラクションでもSVGドキュメントをインタラクティブにナビゲートできますが、ズーム、パン、回転の量を正確に望むとおりに定義することができることが望ましい場合もあります。それらの機能は、"View->Transform" (Ctrl-S) メニューから利用できる変換ダイアログが提供しています。


サムネイル

ドキュメントをパニングしていると、ウィンドウではあなたがドキュメント中にズームした場所を追うのが難しくなることがあります。ドキュメント全体を見ることが出来ないためです。巨大なドキュメントの(あるいは巨大な拡大率の)パニングは、"View -> Thumbnail" メニュー項目あるいは Ctrl-Y キーボード アクセラレーションで立ち上げることが出来るサムネイルによって簡単になります。このサムネイルは、 The thumbnail shows a rectangular marker that represents the "見たいエリア"、すなわち現在ウィンドウで表示されている領域(ドキュメントの見えている部分)を表す矩形のマーカーを表示します。あなたはこの小さなマーカーを左マウスボタンでドラッグして、他の見たいエリアまでドラッグして、メイン ウィンドウ中の他のドキュメントの部分を表示することができます。

SVG ブラウザのサムネイル




Copyright © 2000-2001 The Apache Software Foundation. All Rights Reserved.