Hi,

I know that it sounds silly, but let me explain first.
I created a svg which should be used as a title-image of a cocoon-served
website. The graphics-designer wants the text in the title to be centered.
At first I created a svg which gets the calculated text length and
automatically positions the texts using the event "onload". 
After finishing the SVG and testing it using the Adobe SVG-Viewer I changed
the svg into a xsl-file (I want the svgs to contain dynamic content). Now,
when trying to view the dynamic image within cooon, the text the correct
one, but it is not positioned. What do I have to do to make cocoon/batik
center my text?

Thanx in advance,
        Chris

PS: Here is my svg-code:
<?xml version="1.0" encoding="iso-8859-1"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform";
xmlns:fo="http://www.w3.org/1999/XSL/Format";>
   <xsl:param name="prefix" />
   <xsl:param name="suffix" />

   <xsl:template match="/">
        <xsl:variable name="text">
                        <xsl:value-of select="translate(
translate(substring-before(substring-after(//total-path, $prefix), $suffix),
'$', ' '), '^', '/')"/>
        </xsl:variable>
        <svg width="800" height="50">
                <script type="text/javascript"><![CDATA[
              
                    function center_text()
                    {
                                        var svgdoc, txtelem, width,
textpos_x;
        
                                        // get the svg-object
                                        svgdoc    =
document.documentElement;
        
                                        // get the svgs width
                                        width     =
svgdoc.getAttribute("width");
                
                                        // get a reference to the
text-element
                                        txtelem   =
svgdoc.getElementById("text");
                
                                        // calculate the texts x-possition
                                        textpos_x = (width/2) -
(txtelem.getComputedTextLength()/2);
                                        
                                        // set the texts x-possition
                                        txtelem.setAttribute("x",
textpos_x);
                    }      
              
                        ]]>
                        </script>
                <rect x="0" y="0" width="800" height="50"
style="fill:rgb(35,44,111)"/>
                <text id="text" onload="center_text()" y="32px"
style="fill:rgb(212,212,212);font-size:24;font-family:@Arial Unicode
MS"><xsl:value-of select="$text"/></text>
        </svg>
   </xsl:template>
</xsl:stylesheet>

 



---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]

Reply via email to