Hi Roger, I'm afraid I'm not sure I understand your problem correctly. Are you using the SVG's built-in animation features (ie. <animate> elements, etc.) to animate your content? Are you expecting that once you've animated an attribute with such elements, any call to .setAttributeNS (null, 'cx', some_val) will trigger a new animation to that value? If so, your expectation will not be fullfilled. Core DOM calls, such as .setAttributeNS(), never trigger animations, they're just discrete updates to the DOM. If you want to update the values of an animation, you can try the following technique:
<svg xmlns="http://www.w3.org/2000/svg"; version="1.1" onload="init()"> <title>Animation Example</title> <script type="text/javascript"> <![CDATA[ var animation; var currentCx = 100; var INCREMENT = 50; function init () { animation = document.getElementById('animation'); } function incrementTargetValue () { animation.setAttributeNS(null, 'from', currentCx); currentCx += INCREMENT; animation.setAttributeNS(null, 'to', currentCx); animation.beginElement(); } ]]> </script> <circle cx="100" cy="100" r="100" onclick="incrementTargetValue()"> <animate id="animation" attributeName="cx" begin="indefinite" dur="1s" fill="freeze" /> </circle> </svg> I also wrote an article for dev.opera.com about mixing SMIL-based declarative animation and scripting: http://dev.opera.com/articles/view/advanced-svg-animation-techniques/ Hope it can be useful to you. Antoine -- Blog — http://the.fuchsia-design.com On 3 sept. 07, at 10:22, Roger F. Gay wrote: > Can't seem to work out how to get a simple animation to run again > after altering attributes with javascript. I can make a circle jump > from place to place. But when I add animate to get it to move > smoothly - it only works the first time. i.e. what I want to do is > feed new coordinates to a function - update the svg - and watch the > circle move (not jump) to each new position. > > I have a circle, created and added to a page using javascript. > That works fine. I then alter the x and y coordinate attributes > using the following code: that works fine too. The circle jumps > from place to place on the page. > > circ.setAttribute("cx",x); > circ.setAttribute("cy",y); > > [cx and cy are the SVG attributes. x and y are the new values.] > > Now I've added animate tags for both cx and cy. When I first do > this, it works fine. The object moves (not jumps) from one point to > another. But then, altering the x,y coordinates as above no longer > works; not even to make it jump. > > Is there something I need to set or refresh each time to trigger > the animate? > > The above explains the problem - can't move the circle again once > the animate completes the first time. I have tried changing > animate's from and to attributes at the same time. ----- To unsubscribe send a message to: [EMAIL PROTECTED] -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: mailto:[EMAIL PROTECTED] mailto:[EMAIL PROTECTED] <*> To unsubscribe from this group, send an email to: [EMAIL PROTECTED] <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
