# Re: Fwd: Question on gradient userSpaceOnUse

From: Ken Stacey <ken@svgmaker.com>
Date: Tue, 05 Jan 2010 21:37:42 +1000
Message-ID: <4B432486.2080806@svgmaker.com>

```I agree with Dirk, the gradient should be perpendicular in user space.

Below is Jeff and Erik's examples extended further to show a
perpendicular line in user space.

Ken Stacey

<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg"
<defs>
<linearGradient id="g1" x1="0" y1="0" x2="400" y2="50"
<stop offset="0" stop-color="red"/>
<stop offset="0.5" stop-color="green"/>
<stop offset="1.0" stop-color="blue"/>
<linearGradient id="g2" x1="0" y1="0" x2="100" y2="50"
<stop offset="0" stop-color="red"/>
<stop offset="0.5" stop-color="green"/>
<stop offset="1.0" stop-color="blue"/>
</defs>

<g transform="translate(100,100)">
<g transform="scale(0.25,1)">
<rect width="400" height="50" fill="url(#g1)" />
<!-- show the gradient vector in current user space -->
<line x1="0" y1="0" x2="400" y2="50" stroke="black"/>
<!-- show the perpendicular vector in current user space -->
<line x1="0" y1="0" x2="400" y2="50" stroke="black"
transform="translate(200,25) rotate(-90)"/>
</g>
</g>
<g transform="translate(100,200)">
<rect width="100" height="50" fill="url(#g2)" />
<!-- show the gradient vector in current user space -->
<line x1="0" y1="0" x2="100" y2="50" stroke="black"/>
<!-- show the perpendicular vector in current user space -->
<line x1="0" y1="0" x2="100" y2="50" stroke="black"
transform="translate(50,25) rotate(-90)"/>
</g>
</svg>
```
Received on Tuesday, 5 January 2010 11:38:14 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 22:54:25 UTC