- From: Roche, Conrad (Cognizant) <Conrad.Roche@cognizant.com>
- Date: Wed, 19 May 2004 14:13:06 -0700
- To: <www-svg@w3.org>
- Message-ID: <5B1E4655A9E7D611962700508BD8A99C4C4736@ctsusphx.cts.com>
Hi, Is it possible to have the color of the line change from one end to the other? I tried using linearGradient, but the output wasn't as expected! I want one end of the line to be green (the first 10%), the center to be black and the end (the last 10%) to be blue. The lines connect two arbitrary points on the circle (the svg is generated using java). Here's a sample output - <?xml version="1.0" encoding="UTF-8"?> <svg width="80" height="80"> <defs> <linearGradient id="MyGradient" x1="0%" y1="0%" x2="100%" y2="100%" gradientUnits="userSpaceOnUse"> <stop offset="20%" stop-color="#0F0" /> <stop offset="20%" stop-color="#000" /> <stop offset="80%" stop-color="#000" /> <stop offset="80%" stop-color="#00F" /> </linearGradient> </defs> <g id="dtdcircle" style="fill:none; stroke:black;" transform="translate(40, 40)"> <circle fill="none" r="20" cx="0" id="boundary" cy="0" stroke="blue" stroke-width="1"/> <line y2="-20.0" style="fill:none; stroke:url(#MyGradient);" x1="-20.0" x2="0" y1="0"/> <line y2="20.0" style="fill:none; stroke:url(#MyGradient);" x1="-20.0" x2="0" y1="0"/> <line y2="0.0" style="fill:none; stroke:url(#MyGradient);" x1="-20.0" x2="20.0" y1="0"/> </g> </svg> cheers Conrad This e-mail and any files transmitted with it are for the sole use of the intended recipient(s and may contain confidential and privileged information.If you are not the intended recipient, please contact the sender by reply e-mail and destroy all copies of the original message. Any unauthorised review, use, disclosure, dissemination, forwarding, printing or copying of this email or any action taken in reliance on this e-mail is strictly prohibited and may be unlawful. Visit us at http://www.cognizant.com
Received on Wednesday, 19 May 2004 18:27:17 UTC