XML Editor
Sign up for a WebBoard account Sign Up Keyword Search Search More Options... Options
search
Chat Rooms Chat Help Help News News Log in to WebBoard Log in Not Logged in
Home » Boards » Stylus Studio Developer Network » XSLT Help and Discussion » SVG path d --> XSLT
Conferences Close Tree View
+ Stylus Studio Feature Requests (1192)
+ Stylus Studio Technical Forum (14621)
+ Website Feedback (249)
- XSLT Help and Discussion (7625)
-> + Use of before and after string (3) Sticky Topic
-> - How do I substitute element ty... (1)
-> + How does one add working days ... (4)
-> - Help, I have existing XLT and... (1)
-> + Need help on XSLT issue - (2)
-> + EDI to XML Conversion (7)
-> - XML To JSON Conversion using X... (1)
-> + Formatting Paragraphs to same ... (2)
-> - Grouping of records (1)
-> + Problems with xsd 1.1 (4)
-> + XML to HL7 mapping (3)
-> + XSLT 3 and Iterate (2)
-> + XSL-FO to PDF preview (3)
-> + java.lang.RuntimeException: Er... (2)
-> + Create Acroforms with Stylus X... (2)
-> + How to change XSLT parameter s... (3)
-> + how to change format of the da... (2)
-> + Search "Next 8 Results " doesn... (2)
-> - Support for Git (1)
-> + newbee (8)
-- [1-20] [21-40] [41-60] Next
+ XQuery Help and Discussion (2017)
+ Stylus Studio FAQs (159)
+ Stylus Studio Code Samples & Utilities (364)
+ Stylus Studio Announcements (113)
Topic  
Postnext
joe jSubject: SVG path d --> XSLT
Author: joe j
Date: 22 Mar 2005 09:45 AM
Hello,

SVG is XML. I have the follwing...

<path d="M 20,20 L 200,20 100,200 Z">

and I would like to transform the d attribute in path element into another
xml format as follows:

<path>
<d>
<move position="absolute">
<x>20</x>
<y>20</y>
</move>
<lineto position="absolute">
<x>200</x>
<y>20</y>
</lineto>
<lineto position="absolute">
<x>100</x>
<y>200</y>
</lineto>
<closepath position="absolute" />
</d>
</path>

------------

how can I do the above in XSLT?!! Please if anyone and an idea on how to do let me know.

thank you
Postnext
Tony LavinioSubject: SVG path d --> XSLT
Author: Tony Lavinio
Date: 22 Mar 2005 11:48 AM
Assuming the input is this:
<path d="M 20,20 L 200,20 100,200 Z"/>
please find attached a stylesheet to do what you asked. The chained
line-to's were a little tricky ;)


Documentun-svg.xsl
Turn SVG d attributes into other XML
Postnext
joe jSubject: SVG path d --> XSLT
Author: joe j
Date: 22 Mar 2005 12:57 PM
Thats GREAT thank you very much but can you explain the code for me so I undertand it :-)
Postnext
Tony LavinioSubject: SVG path d --> XSLT
Author: Tony Lavinio
Date: 22 Mar 2005 05:34 PM
The idea is simple - we take one token off the string at a time,
and handle it. If it requires parameters, we take the next token
off the string.

With anything left over, we call ourselves.

For the 'L' line-to instructions, if we see a second set of
coordinates after the first, we insert the extra 'L' and then
call ourselves, so that "L 10,10 20,20" is treated as
"L 10,10 L 20,20".
Postnext
joe jSubject: SVG path d --> XSLT
Author: joe j
Date: 22 Mar 2005 01:38 PM
One more ting... :-)

as you have coded the xslt, the d data should be sapareted with comma between each
data chunk! What if there is no comma and instead there a space which can happen in svg?

You know that there is many possibilites that d data can be formed in
Postnext
Tony LavinioSubject: SVG path d --> XSLT
Author: Tony Lavinio
Date: 22 Mar 2005 05:38 PM
"You know that there is many possibilites that d data can be formed in"

I don't know; I'm not an expert on SVG. I just made the transformation
work on the input file you supplied.

It will be a lot of work to handle every possible SVG case; but I
suspect you don't need them all. With a little tweaking, you can
change the code to handle the commas-verses-spaces.

Instead of looking for a ' ', change the calling code to do a
translate(..., ',', ' ') or something. Then peel off the parameters one
by one, instead of treating the x,y as a single unit like I do. It
might even simplify the code a little.

Stylus Studio has an excellent debugger; single-step through the code
and you will quickly see how it works and how to change it to meet your
needs. Especially open the 'variables' window and watch how things are
taken apart.
Postnext
joe jSubject: SVG path d --> XSLT
Author: joe j
Date: 22 Mar 2005 09:56 PM
Thank you very very much for your help. I really approciate it :-)

One more thing please:

I have another XSLT tranformation from XML to SVG d path. It works fine but
the problem is only the spaces I keep getting..dont know why. I tried many things but
since I am new at this, it might be easy for you.
Here is the code>

<xsl:template match='path'>
<xsl:element name='path'>
<xsl:attribute name='d'>
<xsl:apply-templates mode='in_path' />
</xsl:attribute>
</xsl:element>
</xsl:template>

<xsl:template match='Move' mode='in_path'>
<xsl:choose>
<xsl:when test='@position="absolute"'>M</xsl:when>
<xsl:otherwise>m</xsl:otherwise>
</xsl:choose>
<xsl:value-of select="x" /><xsl:text>,</xsl:text><xsl:value-of select="y" />
</xsl:template>

<xsl:template match='Line' mode='in_path'>
<xsl:choose>
<xsl:when test='@position="absolute"'><xsl:text>L</xsl:text></xsl:when>
<xsl:otherwise><xsl:text>l</xsl:text></xsl:otherwise>
</xsl:choose>
<xsl:value-of select="x" /><xsl:text>,</xsl:text><xsl:value-of select="y" />
</xsl:template>

<xsl:template match='HLine' mode='in_path'>
<xsl:choose>
<xsl:when test='@position="absolute"'><xsl:text>H</xsl:text></xsl:when>
<xsl:otherwise><xsl:text>h</xsl:text></xsl:otherwise>
</xsl:choose>
<xsl:value-of select='x' />
</xsl:template>

<xsl:template match='VLine' mode='in_path'>
<xsl:choose>
<xsl:when test='@position="absolute"'><xsl:text>V</xsl:text></xsl:when>
<xsl:otherwise><xsl:text>v</xsl:text></xsl:otherwise>
</xsl:choose>
<xsl:value-of select='y' />
</xsl:template>

<xsl:template match='Cubic' mode='in_path'>
<xsl:choose>
<xsl:when test='@position="absolute"'><xsl:text>C</xsl:text></xsl:when>
<xsl:otherwise><xsl:text>c</xsl:text></xsl:otherwise>
</xsl:choose>
<xsl:value-of select='xc1' />
<xsl:choose>
<xsl:when test="number(yc1) &lt; number(0)"><xsl:value-of select='yc1' /></xsl:when>
<xsl:otherwise><xsl:text>,</xsl:text><xsl:value-of select='yc1' /></xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="number(xc2) &lt; number(0)"><xsl:value-of select='xc2' /></xsl:when>
<xsl:otherwise><xsl:text>,</xsl:text><xsl:value-of select='xc2' /></xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="yc2 &lt; 0"><xsl:value-of select='yc2' /></xsl:when>
<xsl:otherwise><xsl:text>,</xsl:text><xsl:value-of select='yc2' /></xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="x &lt; 0"><xsl:value-of select='x' /></xsl:when>
<xsl:otherwise><xsl:text>,</xsl:text><xsl:value-of select='x' /></xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="y &lt; 0"><xsl:value-of select='y' /></xsl:when>
<xsl:otherwise><xsl:text>,</xsl:text><xsl:value-of select='y' /></xsl:otherwise>
</xsl:choose>
</xsl:template>

<xsl:template match='SCubic' mode='in_path'>
<xsl:choose>
<xsl:when test='@position="absolute"'>
<xsl:text>S</xsl:text>
</xsl:when>
<xsl:otherwise>
<xsl:text>s</xsl:text>
</xsl:otherwise>
</xsl:choose>
<xsl:value-of select='xc2' /><xsl:text>,</xsl:text>
<xsl:value-of select='yc2' /><xsl:text>,</xsl:text>
<xsl:value-of select='x' /><xsl:text>,</xsl:text>
<xsl:value-of select='y' /><xsl:text>,</xsl:text>
</xsl:template>

<xsl:template match='Quadratic' mode='in_path'>
<xsl:choose>
<xsl:when test='@position="absolute"'>
<xsl:text>Q</xsl:text>
</xsl:when>
<xsl:otherwise>
<xsl:text>q</xsl:text>
</xsl:otherwise>
</xsl:choose>
<xsl:value-of select='xc' /><xsl:text>,</xsl:text>
<xsl:value-of select='yc' /><xsl:text>,</xsl:text>
<xsl:value-of select='x' /><xsl:text>,</xsl:text>
<xsl:value-of select='y' /><xsl:text>,</xsl:text>
</xsl:template>


<xsl:template match='SQuadratic' mode='in_path'>
<xsl:choose>
<xsl:when test='@position="absolute"'>
<xsl:text>T</xsl:text>
</xsl:when>
<xsl:otherwise>
<xsl:text>t</xsl:text>
</xsl:otherwise>
</xsl:choose>
<xsl:value-of select='x' /><xsl:text>,</xsl:text>
<xsl:value-of select='y' /><xsl:text>,</xsl:text>
</xsl:template>


<xsl:template match='Arc' mode='in_path'>
<xsl:choose>
<xsl:when test='@position="absolute"'>
<xsl:text>A</xsl:text>
</xsl:when>
<xsl:otherwise>
<xsl:text>a</xsl:text>
</xsl:otherwise>
</xsl:choose>
<xsl:value-of select='rx' /><xsl:text>,</xsl:text>
<xsl:value-of select='ry' /><xsl:text>,</xsl:text>
<xsl:value-of select='rot' /><xsl:text>,</xsl:text>
<xsl:value-of select='lf' /><xsl:text>,</xsl:text>
<xsl:value-of select='sf' /><xsl:text>,</xsl:text>
<xsl:value-of select='x' /><xsl:text>,</xsl:text>
<xsl:value-of select='y' /><xsl:text>,</xsl:text>
</xsl:template>

<xsl:template match='close' mode='in_path'>
<xsl:text>Z</xsl:text>
</xsl:template>


and the output is like this when it is XML>>>

<path d="


M 0 , 312

C 40 , 48 , 120 -32 , 160 -6
C 0 , 0 , 5 , 4 , 10 -3
C 10 -103 , 50 -83 , 90 -42
C 0 , 0 , 20 , 12 , 30 , 7
C -2 , 12 -18 , 17 -40 , 17
C -55 -2 -40 , 25 -20 , 35
C 30 , 20 , 35 , 65 -30 , 71
c -50 , 4 -170 , 4 -200 -79

Z

"/>


I tried to remove spaces but it didnt work, can see where and what I should do to achieve this?
thank yo in advance
Postnext
Tony LavinioSubject: SVG path d --> XSLT
Author: Tony Lavinio
Date: 24 Mar 2005 01:15 AM
It would make things much easier if you would just post the
whole .xsl and the .xml file. Otherwise, I have to guess at
your input, and also build out the rest of the .xsl file.

Rather than pasting them into the editbox, please use the
Attach File checkbox. You can attach more than one file, and it
makes the messages much easier to read.
Postnext
joe jSubject: SVG path d --> XSLT
Author: joe j
Date: 24 Mar 2005 04:15 PM
I am sorry...Its because I am new to this forum.

Here are the files


UnknownXML_to_path.xsl
XML to Path XSLT

Unknowntest(6).xml
SVG XML Source File
Postnext
joe jSubject: SVG path d --> XSLT
Author: joe j
Date: 30 Mar 2005 10:00 AM
anybody help please
Postnext
Ivan PedruzziSubject: SVG path d --> XSLT
Author: Ivan Pedruzzi
Date: 30 Mar 2005 03:05 PM
Joe

This is a common beginner mistake
you need to overwrite the default match for text nodes

<xsl:template match="text()" mode='in_path'/>

also you can make your XSLT less verbose replace this
<xsl:value-of select="x" /><xsl:text>,</xsl:text><xsl:value-of select="y" />

with this
<xsl:value-of select="concat(x, ',', y)"/>


Hope this helps
Ivan
Postnext
joe jSubject: SVG path d --> XSLT
Author: joe j
Date: 31 Mar 2005 06:12 PM
Thank you very much for your reply. It was a good tip and I switched to it.

However, the main problem which is transforming the d atribute into xml still there!
I got half-way, thanks to the replies, but what if there was no spaces inbetween or no commas?
The SVG can be formed in to several forms but not alot:

<path d="M20,20,L,30,21,23,22,z"> comma separeted..
<path d="M20,20 L 30,21,23,22 z"> comma & space separeted
<path d="M20 20 L 30 21 23 22z"> space separeted
<path d="M20,20L30,21,23,22z"> comma & space separeted & no space before/after commands
<path d="M20 20L 30,21 L23 22 L 44,55z"> Mixture of the above

I cant think of any other forms but this is the major once I guess and the once I will be using..

thank you
Posttop
Ivan PedruzziSubject: SVG path d --> XSLT
Author: Ivan Pedruzzi
Date: 01 Apr 2005 02:35 PM

Joe,


I don't understand what do you mean with

<<" but what if there was no spaces inbetween or no commas?">>

It is up to you which kind of SVG to generate and which style to format the coordinate
You could use a global parameter to define the list separator then to generate different style
changing the parameter value.
   
Download A Free Trial of Stylus Studio 6 XML Professional Edition Today! Powered by Stylus Studio, the world's leading XML IDE for XML, XSLT, XQuery, XML Schema, DTD, XPath, WSDL, XHTML, SQL/XML, and XML Mapping!  
go

Log In Options

Site Map | Privacy Policy | Terms of Use | Trademarks
Stylus Scoop XML Newsletter:
W3C Member
Stylus Studio® and DataDirect XQuery ™are from DataDirect Technologies, is a registered trademark of Progress Software Corporation, in the U.S. and other countries. © 2004-2016 All Rights Reserved.