http://www.w3c.org/Graphics/SVG).
The following example comprises an SVG file exported by the TIGERGraphViewer. It
illustrates how an Cascading Stylesheet is used to set the
background color of an image to white:The Scalable Vector Graphics format SVG is an XML-based format.
Thus, Cascading Stylesheets (CSS) or Extensible
Stylesheets (XSLT) can be used to modify an image.
The embedding of stylesheets in SVG documents is explained in the SVG
specifications located at the W3C web site ( http://www.w3c.org/Graphics/SVG).
The following example comprises an SVG file exported by the TIGERGraphViewer. It
illustrates how an Cascading Stylesheet is used to set the
background color of an image to white:
<svg width="662" height="333">
<style type="text/css">
g[type="bgcolor"] > rect { fill:white }
</style>
<g type="sentence" id="s10">
<!-- create background color -->
<g type="bgcolor">
<rect x="0" y="0" width="662" height="333" fill="grey"/>
</g>
<!-- terminal node "s10_1":[word="There" & pos="EX"] -->
<g type="t" id="s10_1" match="subgraph" font-family="dialog" font-style="normal" font-weight="normal" font-size="14" fill="rgb(150,0,0)">
<text x="55" y="276" text-anchor="middle">There</text>
<text x="55" y="297" text-anchor="middle">EX</text>
</g>
...
</g>
</svg>
To develop your own Cascading Stylesheets, we recommend you to export
an SVG example corpus graph which makes use of an image filter. The
generated SVG file can be used to experiment with your stylesheet.
The SVG specification supports Cascading Stylesheets Level 2 which are
described in a W3C specification (cf. http://www.w3c.org/Style/CSS).
The integration of your own CSS stylesheets is quite simple. All stylesheets that are represented by image filters in the graphical user interface are listed in a file named tigersearch_svg.xml which is located in the config/ subdirectory of your TIGERSearch installation directory. The file looks like the following:
<svgfilter version="1.0">
<filter name="black/white">
text { fill:black }
line,rect,ellipse { stroke:black }
rect { fill:white }
path { stroke:black }
</filter>
<filter name="white background">
g[type="bgcolor"] > rect { fill:white }
</filter>
</svgfilter>
To add your stylesheets, just insert a new <filter> element. Specify the stylesheet name by setting the value of the attribute name. Insert the stylesheet text as the element content of the new <filter> element.
Be aware of the XML element content conventions, e.g. use < instead of < in the content of a <filter> element. Please also note that TIGERSearch has to be restarted in order to activate the new stylesheet configuration.
All XSLT stylesheets used to transform the export of query matches are placed in the export/ subdirectory of your TIGERSearch installation directory. If you want to develop a new stylesheet, we recommend you to use the file testsentence.xml for testing your stylesheet. As the matching corpus graphs are processed on your stylesheet separately, this test file illustrates the XML representation of one single graph. It is located in the export/ directory, too.
The XSLT stylesheets offered by the user interface are registered in a file named TIGERExportRegistry.xml which is also located in the export/ subdirectory. This file looks like the following:
<registry version="1.0"> <stylesheet name="bracketing format" sentence_xslt="bracket.xsl"/> <stylesheet name="sentence format (tokens)" sentence_xslt="sentence.xsl"/> <stylesheet name="sentence format (tokens + pos)" sentence_xslt="pos.xsl"/> </registry>
To add your stylesheet, just insert a new <stylesheet> element. Specify the stylesheet name by setting the value of the attribute name. Specify the filename by setting the value of the sentence_xslt attribute.
Please note: TIGERSearch has to be restarted in order to activate
the new stylesheet configuration.