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

Home

Overview
FAQ
Demo
License
Download
Install

Viewer
Rasterizer
SVG Applet
Generator

Who we are
Status
CVS Repository
Mail Archive
Bug Database

Glossary
Regression tool
API (Javadoc)



Introduction

Batik Viewer

This page describes the main features of the SVG Viewer that comes with Batik. It discusses the following:


Downloading the viewer

Refer to the download area to find out how to download Batik. Remember that you can get either the developer distribution or the binary distribution.


Starting the viewer

The method for starting the viewer depends on the distribution of Batik that you chose to download. The following describes how to start the viewer for each distribution

Starting the viewer for the binary distribution

If you downloaded the binary distribution of Batik, you should have gotten a file called batik-1.0beta.zip, which, when expanded, created a batik-svgviewer.jar file. To start the viewer, simply type the following on the command line:

java -jar batik-svgviewer.jar

You can pass options to the command line:

java -jar batik-viewer.jar [-sf] [-lnf [lookAndFeelName]] [svgURL]

Where:

  • -sf will make the viewer use small fonts in the GUI.
  • -lnf [lookAndFeelName] will make the user use the [lookAndFeelName] look and feel, which must be a Swing Look and Feel.
  • [svgURL] the URL for the SVG file the viewer should open when it starts

For example:

  • java -jar batik-svgviewer.jar -sf starts the viewer with small fonts.
  • java -jar batik-svgviewer.jar -lnf com.sun.java.swing.plaf.motif.MotifLookAndFeel starts the viewer with the Motif look and feel. The default look and feel is Metal, the default Swing look and feel
  • java -jar batik-svgviewer.jar -sf logo.svg starts the viewer with the logo.svg file open (and small fonts, because of -sf)

Starting the viewer for the developer distribution

If you downloaded the developer distrubution of Batik, you should have gotten a zip or tar file that expanded into an xml-batik directory. In that directory, you can find build scripts for the platform you are running on. For example, there is a build.bat script for users of the Windows platform and there is a build.sh script for UNIX users.

To start the viewer you should:

  • Make sure the xml-batik directory is in your PATH environment variable
  • Make sure the ANT_HOME environment variable is set to the xml-batik directory
  • Open a command line window and go to the xml-batik directory where the Batik distribution was expanded
  • At the command prompt, type: build svgviewer. This will start the viewer

You can pass options to the viewer as follows:

build svgviewer -Dargs="[-sf] [-lnf [lookAndFeelName]] [svgURL]"

Refer to "Starting the viewer for the binary distribution" for an explanation of these options


SVG viewer screen shot

Batik Viewer



Viewing an SVG file

There are several ways to view an SVG file. The following sections explain each method

Opening a local SVG file

File Open in SVG Viewer

In situations where you have an SVG file locally on the machine where you are running the Batik SVG viewer, you can use the "File->File Open" menu item to open that file, or use the "Ctrl-F" key accelerator. Doing so brings up a file choser that lets you select the file you want to view.


Opening an SVG file from the Web

Open Page in SVG Viewer

There are many situations where the SVG content you want to view is not local to the machine where the viewer is running. In that case, you can use the "File->Open Page" menu item, or use the "Ctrl-O" key accelerator to open that page. Doing so brings up a dialog box where you can type in the URL for the file you want to view.


Using the location text field to view an SVG file

Location Bar in SVG Viewer

When you know the URL of the document you want to view, you can enter it directly in the location bar text field at the top of the SVG viewer, the same way you can enter a URL in an HTML browser


Setting up a proxy server for the Batik SVG viewer

When you are accessing the Web through a firewall and the SVG content you want to access is on the Web, you will need to use a proxy server to access that content, the same way you need to set up a proxy server for your HTML browser.

For users of the binary distribution, you need to type, at the command prompt:

java -Dhttp.proxyHost=<proxyHost> -Dhttp.proxyPort=<proxyPort> -jar batik-svgviewer.jar

For example, if your proxy is firewall.eng.mycompany.com on port 8080:

java -Dhttp.proxyHost=firewall.eng.mycompany.com -Dhttp.proxyPort=8080 -jar batik-svgviewer.jar

For users of the binary distribution, you need to edit the build.xml file in the root directory to set the equivalent properties:

    <java fork="yes"
          classname="${class-prefix}.apps.svgviewer.Main"
          jvmargs="-DproxyHost=firewall.eng.mycompany.com -DproxyPort=8080">
      <classpath>
        <pathelement location="${dest}" />
        <path refid="libs-classpath"/>
        <pathelement location="resources" />
      </classpath>
      <arg value="${args}"/>
    </java>
            


Viewing multiple SVG files

Viewing multiple files

The Batik SVG Viewer can display multiple files simultaneously in different windows. To view a new file in a separate window, simply select the "File-> New Window..." menu item or use the Ctrl-N keyboard accelerator.


Viewing the source

Viewing the source code

When the viewer displays an SVG file, you can select the "View-> View Source..." menu item or use the Ctrl-U keyboard accelerator to view the source code.


Viewing the document tree

Viewing the document tree

When the viewer displays an SVG file, you can select the "View-> View Document Tree..." menu item or use the Ctrl-T keyboard accelerator to open a dialog that shows the SVG document in the form of a tree. The dialog lets you navigate the tree, select individual elements, such as a filter element, and view the attributes and CSS values that apply to these elements.


Zooming, panning and rotating documents
Zooming in

Zooming in an SVG document

Zooming in an SVG document

There are several methods to zoom in an SVG Document:

  • You can select the "View -> Zoom In" menu item
  • You can click on the "Zoom In" tool bar buttom (the one that shows a magnifying glass with a "+" sign)
  • You can use the "Ctrl+Shift+P" keyboard acceleration
  • If the mouse is over the document in the display area, you can press the Ctrl key then click the left mouse button and drag to select the area of interest in the document

Zooming out

Zooming out an SVG document

There are several methods to zoom out in an SVG Document:

  • You can select the "View -> Zoom Out" menu item
  • You can click on the "Zoom Out" tool bar buttom (the one that shows a magnifying glass with a "-" sign)
  • You can use the "Ctrl+Shift+O" keyboard acceleration

Restoring the original size of a document

Restoring the initial zoom in an SVG document

Sometimes, after zooming, panning and rotating a document, it is useful to be able to restore its original size, i.e., view it as it was first loaded:

  • You can select the "View -> Initial Zoom" menu item
  • You can click on the "Initial Zoom" tool bar buttom (the one that shows a square with four arrows pointing in the Nort, East, South and West directions)
  • You can use the "Ctrl+1" keyboard acceleration

Panning a document

Panning in an SVG document

Some documents are too big to fit into the viewer, especially when you zoom in with a large zoom factor. In these circumstances, it is usefull to be able to 'move around' the document and pan to view different parts of the documents. Again, there are multiple ways to do this:

  • With the mouse cursor over the SVG document, press the Shift key and then click and drag the left mouse button to a new location. When you release the mouse, the document will be translated to the new mouse location.
  • If you have the thumbnail open, you can select the market showing the current area of interest and move it to the desired location

Rotating a document

Rotating an SVG document

It is sometimes useful to be able to rotate a document (maps for example). You can do this in the Batik viewer by first pressing the Ctrl key and then clicking and dragging the left mouse button to a new location. A marker will show the rotation angle corresponding to the new mouse cursor location. When you are satisfied with that angle, you can release the mouse button and the document will be displayed with the rotation you have specified.


Thumbnail

SVG Viewer Thumbnail

Panning in the document window can be difficult after you have zoomed into a document because you cannot see the whole document. Panning on large documents (or with a large zoom factor) is made easy by the thumbnail that you can bring up through the "View -> View Document Thumbnail" menu item or Ctrl-O keyboard acceleration. The thumbnail shows a rectangular marker that represents the "Area of Interest", i.e., the region currently displayed in the window (the visible portion of the document). You can grag that little marker with the left mouse button and drag it to another area of interest to view a different portion of the document in the main window.




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