- From: Ken Stacey <ken@svgmaker.com>
- Date: Fri, 08 Jan 2010 04:25:16 +1000
- To: www-svg@w3.org
Another example for comparison - with skew. The gradient vector is
horizontal. The magenta lines are normal to the gradient vector prior
to being transformed.
<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<linearGradient id="g1" x1="0" y1="0" x2="400" y2="0"
gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="red"/>
<stop offset="0.5" stop-color="green"/>
<stop offset="1.0" stop-color="blue"/>
</linearGradient>
<g id="a1">
<rect width="400" height="50" />
<text font-family="Arial" font-size="53" font-weight="bold"
y="100" >Real-world text!</text>
<line x1="200" y1="-25" x2="200" y2="125" stroke="magenta"/>
</g>
</defs>
<g fill="url(#g1)">
<use xlink:href="#a1" transform="translate(100,100)"/>
<use xlink:href="#a1" transform="matrix(1,0,1,1,100,300)"/>
</g>
</svg>
Ken
Received on Thursday, 7 January 2010 18:25:50 UTC