Nice Chaals! It would be fun if one could build all your gradient stops with one instance and a single <replicate> tag [1,2], of course ;)
It might take a wee bit of an addendum to the spec (of course)! regards David [1] http://srufaculty.sru.edu/david.dailey/svg/SVGOpen2010/replicatePaper/replicatepaper.html [2] http://srufaculty.sru.edu/david.dailey/svg/SVGOpen2010/replicatePaper/replicatetalk.html ----- Original Message ----- From: Charles McCathieNevile To: svg-developers@yahoogroups.com Sent: Sunday, September 26, 2010 12:20 PM Subject: Re: [svg-developers] Re: animating gradients On Thu, 23 Sep 2010 21:48:12 +0200, t...@ymail.com <t...@ymail.com> wrote: > --- In svg-developers@yahoogroups.com, Jacob Beard <jbea...@...> wrote: >> >> On Tue, Sep 21, 2010 at 3:55 PM, t...@... <t...@...> wrote: >> >> > What about this variant: >> > >> > http://wwwpub.zih.tu-dresden.de/~s9783698/scrolling-radial-colors.xml I had a play, and came up with the following script-free version (easier than trying to read script, for me): Note that there seem to be some colour transitions that feel more natural than others. I suspect there is someone who knows more about colour and could explain how to adjust it to make everything seem beautiful, but this seems to at least work... <svg width="100%" height="100%" viewBox="0 0 800 400" version="1.1" xmlns="http://www.w3.org/2000/svg";> <title>rainbow circle</title> <desc>Example - fill a circle using an animated radial gradient paint server to make a colour progression</desc> <g> <defs> <radialGradient id="circularRainbowGradient" r=".6"> <stop offset=".0" stop-color="red"> <animateColor values="violet;blue;green;yellow;orange;red" dur="4s" begin="0s" repeatCount="indefinite" attributeName="stop-color"/> </stop> <stop offset=".2" stop-color="orange"> <animateColor values="red;violet;blue;green;yellow;orange" dur="4s" begin="0s" repeatCount="indefinite" attributeName="stop-color"/> </stop> <stop offset=".4" stop-color="yellow"> <animateColor values="orange;red;violet;blue;green;yellow" dur="4s" begin="0s" repeatCount="indefinite" attributeName="stop-color"/> </stop> <stop offset=".6" stop-color="green"> <animateColor values="yellow;orange;red;violet;blue;green" dur="4s" begin="0s" repeatCount="indefinite" attributeName="stop-color"/> </stop> <stop offset=".8" stop-color="blue"> <animateColor values="green;yellow;orange;red;violet;blue" dur="4s" begin="0s" repeatCount="indefinite" attributeName="stop-color"/> </stop> <stop offset="1" stop-color="violet"> <animateColor values="blue;green;yellow;orange;red;violet" dur="4s" begin="0s" repeatCount="indefinite" attributeName="stop-color"/> </stop> </radialGradient> </defs> <circle fill="url(#circularRainbowGradient)" stroke="none" cx="400" cy="100" r="100"> </circle> </g> </svg> cheers -- Charles McCathieNevile Opera Software, Standards Group je parle français -- hablo español -- jeg lærer norsk http://my.opera.com/chaals Try Opera: http://www.opera.com [Non-text portions of this message have been removed] ------------------------------------ ----- To unsubscribe send a message to: svg-developers-unsubscr...@yahoogroups.com -or- visit http://groups.yahoo.com/group/svg-developers and click "edit my membership" ----Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/svg-developers/ <*> Your email settings: Individual Email | Traditional <*> To change settings online go to: http://groups.yahoo.com/group/svg-developers/join (Yahoo! ID required) <*> To change settings via email: svg-developers-dig...@yahoogroups.com svg-developers-fullfeatu...@yahoogroups.com <*> To unsubscribe from this group, send an email to: svg-developers-unsubscr...@yahoogroups.com <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
