You are viewing a plain text version of this content. The canonical link for it is here.
Posted to batik-users@xmlgraphics.apache.org by Fabian Unfried <in...@funfried.de> on 2010/03/12 13:35:19 UTC
How to create a svg animate tag during runtime and animate it?
Hi,
I would like to know how to handle animations with batik, especially the
animate tag.
If I put the following svg code into an svg graphic and open it with a java
application with batik all works just fine and it'll be animated:
<rect x="100" y="100" width="500" height="500">
<animate attributeType="CSS" attributeName="opacity" calcMode="discrete"
from="1" to="0" dur="1s" repeatCount="indefinite" />
</rect>
But what do I have to do, if I want to do exactly this during runtime?
I've tried this:
SVGOMAnimationElement animate = (SVGOMAnimationElement)
this.svgDocument.createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
SVG12Constants.SVG_ANIMATE_TAG);
animate.setAttribute("dur", "1s");
animate.setAttribute("values", "0; 0; 1; 1");
animate.setAttribute("keyTimes", "0; 0.5; 0.7; 1.0");
animate.setAttribute("attributeName", "opacity");
animate.setAttribute("attributeType", "CSS");
animate.setAttribute("repeatCount", "indefinite");
rect.appendChild(animate);
animate.beginElement();
but this didn't get animated, so I've tried to use the SVGAnimationEngine, but
I'm not sure how to use the addAnimation() method, or even if I need to do
that:
SVGAnimationEngine aEngine = getSVGAnimationEngine();
aEngine.addAnimation((AnimationTarget) rect,
SVGAnimationEngine.ANIM_TYPE_CSS, "?", "?", AbstractAnimation???);
How can I setup an AbstractAnimation?
Any help is very appreciated
Thanks in advance.
Kind regards,
Fabian
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by Fabian Unfried <in...@funfried.de>.
Hi Helder,
I've tried it, now my code looks like this:
// This code will be executed, when a click event appear after everything
// was rendered (eventTarget.addEventListener("click", new OnClickAction(),
// false))
Element parentElement = The rect which should be animated;
SVGOMAnimationElement animateElement = (SVGOMAnimationElement)
this.svgDocument.createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
SVG12Constants.SVG_ANIMATE_TAG);
animateElement.setAttribute("dur", "1s");
animateElement.setAttribute("values", "1; 1; 0; 0");
animateElement.setAttribute("keyTimes", "0; 0.5; 0.7; 1.0");
animateElement.setAttribute("attributeName", "opacity");
animateElement.setAttribute("attributeType", "CSS");
animateElement.setAttribute("repeatCount", "indefinite");
animateElement.setAttribute("begin", "indefinite");
parentElement.appendChild(animateElement);
if(animateElement.beginElement())
{
System.out.println("~~~~~~~~~~~~~~~~~~ Begin animation");
}
But still it doesn't work, any other ideas?
Maybe I'll write a small test application, where you guys can also test a bit.
Regards,
Fabian
> Hi Fabian,
>
>
> > But what do I have to do, if I want to do exactly this during runtime?
> >
> > I've tried this:
> >
> >
> > SVGOMAnimationElement animate = (SVGOMAnimationElement)
> > this.svgDocument.createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> > SVG12Constants.SVG_ANIMATE_TAG);
> > animate.setAttribute("dur", "1s");
> > animate.setAttribute("values", "0; 0; 1; 1");
> > animate.setAttribute("keyTimes", "0; 0.5; 0.7; 1.0");
> > animate.setAttribute("attributeName", "opacity");
> > animate.setAttribute("attributeType", "CSS");
> > animate.setAttribute("repeatCount", "indefinite");
> >
> > rect.appendChild(animate);
> >
> > animate.beginElement();
> >
> >
> > but this didn't get animated, [...]
>
> You'll need to provide a "begin" attribute set to "indefinite" in
> order to be able to trigger animations using script [1]. ;-)
>
> I'd seriously recommend diving into the SVG Primer online book (whole
> page contents in [1]) before serious SVG hacking! ;-)
>
>
> > Any help is very appreciated
> > Thanks in advance.
>
> Hope this helps,
> Helder
>
>
> [1] http://www.w3.org/Graphics/SVG/IG/resources/svgprimer.html#beginElement
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by Helder Magalhães <he...@gmail.com>.
Hi Fabian,
> But what do I have to do, if I want to do exactly this during runtime?
>
> I've tried this:
>
>
> SVGOMAnimationElement animate = (SVGOMAnimationElement)
> this.svgDocument.createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> SVG12Constants.SVG_ANIMATE_TAG);
> animate.setAttribute("dur", "1s");
> animate.setAttribute("values", "0; 0; 1; 1");
> animate.setAttribute("keyTimes", "0; 0.5; 0.7; 1.0");
> animate.setAttribute("attributeName", "opacity");
> animate.setAttribute("attributeType", "CSS");
> animate.setAttribute("repeatCount", "indefinite");
>
> rect.appendChild(animate);
>
> animate.beginElement();
>
>
> but this didn't get animated, [...]
You'll need to provide a "begin" attribute set to "indefinite" in
order to be able to trigger animations using script [1]. ;-)
I'd seriously recommend diving into the SVG Primer online book (whole
page contents in [1]) before serious SVG hacking! ;-)
> Any help is very appreciated
> Thanks in advance.
Hope this helps,
Helder
[1] http://www.w3.org/Graphics/SVG/IG/resources/svgprimer.html#beginElement
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by Fabian Unfried <in...@funfried.de>.
Sorry, forgot to mention it doesn't work with the compiled jars from svn!
> So, I've checked out the newest source code via svn, compiled it and putted
> these libraries into my application:
>
> batik-anim.jar
> batik-ext.jar
> batik-swing.jar
> batik-awt-util.jar
> batik-gui-util.jar
> batik-transcoder.jar
> batik-bridge.jar
> batik-gvt.jar
> batik-util.jar
> batik-codec.jar
> batik-parser.jar
> batik-xml.jar
> batik-css.jar
> batik-script.jar
> xml-apis-ext.jar
> batik-dom.jar
> batik-svg-dom.jar
> xml-apis.jar
> batik-extension.jar
> batik-svggen.jar
>
> That means I've added all except these, because I didn't need them in the
> past:
>
> js.jar
> pdf-transcoder.jar
> xalan-2.6.0.jar
> xerces_2_5_0.jar
>
> Do I need one of them?
>
>
>
> Kind regards,
>
> Fabian
>
> > Hi Helder,
> >
> > thanks for the very fast reply.
> >
> > Indeed I'm not using the newest (svn) code, I'm using the stable 1.7
> instead.
> >
> > I'll try with the latest code and response again.
> >
> >
> > Thanks again.
> >
> >
> > Regards,
> >
> > Fabian
> >
> > > Hi Fabian,
> > >
> > >
> > > > first of all thanks for your reply, but if you create the elements
(rect
> > and
> > > > animate) and then create the document and load it, it should be the
same
> > if
> > > > you already drawn the elements in a svg file and open it.
> > >
> > > Nope. :-p Actually, there is a key difference between having the
> > > animation elements initially and creating them afterward: the
> > > document's timeline has already begun for the ones initially present
> > > in the document! That's why you need the 'begin' attribute plus
> > > 'beginElement()' "trickery", which is actually by design (according to
> > > the SVG specification, if I'm not mistaken). ;-)
> > >
> > > I'd suggest trying with the latest available source code [1] (you
> > > didn't state if you were using the trunk source code or a
> > > snapshot/previous release). If you are following the suggestions in
> > > this thread and you can still can't animate things, I'd say attaching
> > > a simple (reduced) test case would help. ;-)
> > >
> > >
> > > > Kind Regards,
> > > > Fabian
> > >
> > > Hope this helps,
> > > Helder
> > >
> > >
> > > [1]
http://xmlgraphics.apache.org/batik/download.cgi#Subversion+repository
> > >
> > > ---------------------------------------------------------------------
> > > To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> > > For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
> > >
> > >
> > >
> >
> >
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> > For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
> >
> >
> >
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by Fabian Unfried <in...@funfried.de>.
So, I've checked out the newest source code via svn, compiled it and putted
these libraries into my application:
batik-anim.jar
batik-ext.jar
batik-swing.jar
batik-awt-util.jar
batik-gui-util.jar
batik-transcoder.jar
batik-bridge.jar
batik-gvt.jar
batik-util.jar
batik-codec.jar
batik-parser.jar
batik-xml.jar
batik-css.jar
batik-script.jar
xml-apis-ext.jar
batik-dom.jar
batik-svg-dom.jar
xml-apis.jar
batik-extension.jar
batik-svggen.jar
That means I've added all except these, because I didn't need them in the
past:
js.jar
pdf-transcoder.jar
xalan-2.6.0.jar
xerces_2_5_0.jar
Do I need one of them?
Kind regards,
Fabian
> Hi Helder,
>
> thanks for the very fast reply.
>
> Indeed I'm not using the newest (svn) code, I'm using the stable 1.7
instead.
>
> I'll try with the latest code and response again.
>
>
> Thanks again.
>
>
> Regards,
>
> Fabian
>
> > Hi Fabian,
> >
> >
> > > first of all thanks for your reply, but if you create the elements (rect
> and
> > > animate) and then create the document and load it, it should be the same
> if
> > > you already drawn the elements in a svg file and open it.
> >
> > Nope. :-p Actually, there is a key difference between having the
> > animation elements initially and creating them afterward: the
> > document's timeline has already begun for the ones initially present
> > in the document! That's why you need the 'begin' attribute plus
> > 'beginElement()' "trickery", which is actually by design (according to
> > the SVG specification, if I'm not mistaken). ;-)
> >
> > I'd suggest trying with the latest available source code [1] (you
> > didn't state if you were using the trunk source code or a
> > snapshot/previous release). If you are following the suggestions in
> > this thread and you can still can't animate things, I'd say attaching
> > a simple (reduced) test case would help. ;-)
> >
> >
> > > Kind Regards,
> > > Fabian
> >
> > Hope this helps,
> > Helder
> >
> >
> > [1] http://xmlgraphics.apache.org/batik/download.cgi#Subversion+repository
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> > For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
> >
> >
> >
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by Fabian Unfried <in...@funfried.de>.
Hi Helder,
thanks for the very fast reply.
Indeed I'm not using the newest (svn) code, I'm using the stable 1.7 instead.
I'll try with the latest code and response again.
Thanks again.
Regards,
Fabian
> Hi Fabian,
>
>
> > first of all thanks for your reply, but if you create the elements (rect
and
> > animate) and then create the document and load it, it should be the same
if
> > you already drawn the elements in a svg file and open it.
>
> Nope. :-p Actually, there is a key difference between having the
> animation elements initially and creating them afterward: the
> document's timeline has already begun for the ones initially present
> in the document! That's why you need the 'begin' attribute plus
> 'beginElement()' "trickery", which is actually by design (according to
> the SVG specification, if I'm not mistaken). ;-)
>
> I'd suggest trying with the latest available source code [1] (you
> didn't state if you were using the trunk source code or a
> snapshot/previous release). If you are following the suggestions in
> this thread and you can still can't animate things, I'd say attaching
> a simple (reduced) test case would help. ;-)
>
>
> > Kind Regards,
> > Fabian
>
> Hope this helps,
> Helder
>
>
> [1] http://xmlgraphics.apache.org/batik/download.cgi#Subversion+repository
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by Fabian Unfried <fu...@zebra.com>.
Hi Jonathan,
Oh sorry, I didn't catched that, you're right.
Which version of batik do you use? 1.7 or some newer svn build?
Regards,
Fabian
> Hi Fabian,
>
> Note that although the Elements in the example are created at the
beginning of the example, the listener code block runs after the document is
loaded (after theGVTTreeBuilderEvent is fired).
>
>
> On Mon, Mar 15, 2010 at 5:45 AM, Fabian Unfried
<in...@funfried.de>> wrote:
> Hi Jonathan,
>
> first of all thanks for your reply, but if you create the elements (rect and
> animate) and then create the document and load it, it should be the same if
> you already drawn the elements in a svg file and open it.
>
> Maybe I didn't mention that exactly, my problem is that I have already
opened
> a svg file in my application and then would like to add an animation, but if
> I do this like in your example, it won't be animated.
>
>
> Kind Regards,
>
>
> Fabian
>
> > Hi Fabian,
> >
> > It is usually a case of getting the correct attributes. Batik tends to
> follow the standard a bit more closely that some other implementations. The
> following code works for me...posted sans the JFrame init...assumes a class
> member JSVGCanvas named svgCanvas.
> >
> > private void runDemo() {
> > svgCanvas.setDocumentState(JSVGCanvas.ALWAYS_DYNAMIC);
> > svgCanvas.addGVTTreeBuilderListener(new GVTTreeBuilderAdapter() {
> > @Override
> > public void gvtBuildCompleted(GVTTreeBuilderEvent e) {
> >
> svgCanvas.getUpdateManager().getUpdateRunnableQueue().invokeLater(new
> Runnable() {
> > public void run() {
> > Element rect =
>
svgCanvas.getSVGDocument().createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> SVGConstants.SVG_RECT_TAG);
> > rect.setAttributeNS(null,
> SVGConstants.SVG_X_ATTRIBUTE, "100");
> > rect.setAttributeNS(null,
> SVGConstants.SVG_Y_ATTRIBUTE, "100");
> > rect.setAttributeNS(null,
> SVGConstants.SVG_WIDTH_ATTRIBUTE, "100");
> > rect.setAttributeNS(null,
> SVGConstants.SVG_HEIGHT_ATTRIBUTE, "100");
> > rect.setAttributeNS(null,
> SVGConstants.SVG_FILL_ATTRIBUTE, "#2222ee");
> > Element animate =
>
svgCanvas.getSVGDocument().createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> SVGConstants.SVG_ANIMATE_TAG);
> > animate.setAttributeNS(null,
> SVGConstants.SVG_ATTRIBUTE_NAME_ATTRIBUTE,
> SVGConstants.SVG_OPACITY_ATTRIBUTE);
> > animate.setAttributeNS(null,
> SVGConstants.SVG_VALUES_ATTRIBUTE, "1;0");
> > animate.setAttributeNS(null,
> SVGConstants.SVG_DUR_ATTRIBUTE, "3s");
> > animate.setAttributeNS(null,
> SVGConstants.SVG_REPEAT_COUNT_ATTRIBUTE, "indefinite");
> > rect.appendChild(animate);
> >
> svgCanvas.getSVGDocument().getDocumentElement().appendChild(rect);
> > }
> > });
> > }
> > });
> > Document doc =
>
SVGDOMImplementation.getDOMImplementation().createDocument(SVGDOMImplementation.SVG_NAMESPACE_URI, "svg",
> null);
> > svgCanvas.setSVGDocument((SVGDocument) doc);
> > }
> >
> >
> >
> >
> >
> > On Fri, Mar 12, 2010 at 8:35 AM, Fabian Unfried
>
<in...@funfried.de>>>
wrote:
> > Hi,
> >
> > I would like to know how to handle animations with batik, especially the
> > animate tag.
> >
> > If I put the following svg code into an svg graphic and open it with a
java
> > application with batik all works just fine and it'll be animated:
> >
> > <rect x="100" y="100" width="500" height="500">
> > <animate attributeType="CSS" attributeName="opacity"
> calcMode="discrete"
> > from="1" to="0" dur="1s" repeatCount="indefinite" />
> > </rect>
> >
> >
> > But what do I have to do, if I want to do exactly this during runtime?
> >
> > I've tried this:
> >
> >
> > SVGOMAnimationElement animate = (SVGOMAnimationElement)
> > this.svgDocument.createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> > SVG12Constants.SVG_ANIMATE_TAG);
> > animate.setAttribute("dur", "1s");
> > animate.setAttribute("values", "0; 0; 1; 1");
> > animate.setAttribute("keyTimes", "0; 0.5; 0.7; 1.0");
> > animate.setAttribute("attributeName", "opacity");
> > animate.setAttribute("attributeType", "CSS");
> > animate.setAttribute("repeatCount", "indefinite");
> >
> > rect.appendChild(animate);
> >
> > animate.beginElement();
> >
> >
> > but this didn't get animated, so I've tried to use the SVGAnimationEngine,
> but
> > I'm not sure how to use the addAnimation() method, or even if I need to do
> > that:
> >
> > SVGAnimationEngine aEngine = getSVGAnimationEngine();
> > aEngine.addAnimation((AnimationTarget) rect,
> > SVGAnimationEngine.ANIM_TYPE_CSS, "?", "?", AbstractAnimation???);
> >
> > How can I setup an AbstractAnimation?
> >
> >
> >
> > Any help is very appreciated
> >
> > Thanks in advance.
> >
> > Kind regards,
> >
> > Fabian
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail:
>
batik-users-unsubscribe@xmlgraphics.apache.org<ma...@xmlgraphics.apache.org>>
> > For additional commands, e-mail:
>
batik-users-help@xmlgraphics.apache.org<ma...@xmlgraphics.apache.org>>
> >
> >
> >
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail:
batik-users-unsubscribe@xmlgraphics.apache.org<ma...@xmlgraphics.apache.org>
> For additional commands, e-mail:
batik-users-help@xmlgraphics.apache.org<ma...@xmlgraphics.apache.org>
>
>
>
--
Fabian Unfried
Software Engineer
Zebra Enterprise Solutions
Rossfelder Str. 65/5, 74564 Crailsheim, Germany
T+49 7951 9636xx F+49 7951 963611
funfried@zebra.com
www.zebra.com/zes
Navis * WhereNet * proveo * Multispectral Solutions
Managing Directors Zebra Enterprise Solutions GmbH:
William Walsh, Michael Smiley
Registered Office: Ulm, HRB 721672
VAT Number: DE225496806
- CONFIDENTIAL-
This email and any files transmitted with it are confidential, and may also be legally privileged. If you are not the intended recipient, you may not review, use, copy, or distribute this message. If you receive this email in error, please notify the sender immediately by reply email and then delete this email.
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by jonathan wood <jo...@gmail.com>.
Hi Fabian,
Note that although the Elements in the example are created at the
beginning of the example, the listener code block runs after the document is
loaded (after theGVTTreeBuilderEvent is fired).
On Mon, Mar 15, 2010 at 5:45 AM, Fabian Unfried <in...@funfried.de> wrote:
> Hi Jonathan,
>
> first of all thanks for your reply, but if you create the elements (rect
> and
> animate) and then create the document and load it, it should be the same if
> you already drawn the elements in a svg file and open it.
>
> Maybe I didn't mention that exactly, my problem is that I have already
> opened
> a svg file in my application and then would like to add an animation, but
> if
> I do this like in your example, it won't be animated.
>
>
> Kind Regards,
>
>
> Fabian
>
> > Hi Fabian,
> >
> > It is usually a case of getting the correct attributes. Batik tends to
> follow the standard a bit more closely that some other implementations.
> The
> following code works for me...posted sans the JFrame init...assumes a class
> member JSVGCanvas named svgCanvas.
> >
> > private void runDemo() {
> > svgCanvas.setDocumentState(JSVGCanvas.ALWAYS_DYNAMIC);
> > svgCanvas.addGVTTreeBuilderListener(new GVTTreeBuilderAdapter() {
> > @Override
> > public void gvtBuildCompleted(GVTTreeBuilderEvent e) {
> >
> svgCanvas.getUpdateManager().getUpdateRunnableQueue().invokeLater(new
> Runnable() {
> > public void run() {
> > Element rect =
>
> svgCanvas.getSVGDocument().createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> SVGConstants.SVG_RECT_TAG);
> > rect.setAttributeNS(null,
> SVGConstants.SVG_X_ATTRIBUTE, "100");
> > rect.setAttributeNS(null,
> SVGConstants.SVG_Y_ATTRIBUTE, "100");
> > rect.setAttributeNS(null,
> SVGConstants.SVG_WIDTH_ATTRIBUTE, "100");
> > rect.setAttributeNS(null,
> SVGConstants.SVG_HEIGHT_ATTRIBUTE, "100");
> > rect.setAttributeNS(null,
> SVGConstants.SVG_FILL_ATTRIBUTE, "#2222ee");
> > Element animate =
>
> svgCanvas.getSVGDocument().createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> SVGConstants.SVG_ANIMATE_TAG);
> > animate.setAttributeNS(null,
> SVGConstants.SVG_ATTRIBUTE_NAME_ATTRIBUTE,
> SVGConstants.SVG_OPACITY_ATTRIBUTE);
> > animate.setAttributeNS(null,
> SVGConstants.SVG_VALUES_ATTRIBUTE, "1;0");
> > animate.setAttributeNS(null,
> SVGConstants.SVG_DUR_ATTRIBUTE, "3s");
> > animate.setAttributeNS(null,
> SVGConstants.SVG_REPEAT_COUNT_ATTRIBUTE, "indefinite");
> > rect.appendChild(animate);
> >
> svgCanvas.getSVGDocument().getDocumentElement().appendChild(rect);
> > }
> > });
> > }
> > });
> > Document doc =
> SVGDOMImplementation.getDOMImplementation().createDocument(SVGDOMImplementation.SVG_NAMESPACE_URI,
> "svg",
> null);
> > svgCanvas.setSVGDocument((SVGDocument) doc);
> > }
> >
> >
> >
> >
> >
> > On Fri, Mar 12, 2010 at 8:35 AM, Fabian Unfried
> <in...@funfried.de>> wrote:
> > Hi,
> >
> > I would like to know how to handle animations with batik, especially the
> > animate tag.
> >
> > If I put the following svg code into an svg graphic and open it with a
> java
> > application with batik all works just fine and it'll be animated:
> >
> > <rect x="100" y="100" width="500" height="500">
> > <animate attributeType="CSS" attributeName="opacity"
> calcMode="discrete"
> > from="1" to="0" dur="1s" repeatCount="indefinite" />
> > </rect>
> >
> >
> > But what do I have to do, if I want to do exactly this during runtime?
> >
> > I've tried this:
> >
> >
> > SVGOMAnimationElement animate = (SVGOMAnimationElement)
> > this.svgDocument.createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> > SVG12Constants.SVG_ANIMATE_TAG);
> > animate.setAttribute("dur", "1s");
> > animate.setAttribute("values", "0; 0; 1; 1");
> > animate.setAttribute("keyTimes", "0; 0.5; 0.7; 1.0");
> > animate.setAttribute("attributeName", "opacity");
> > animate.setAttribute("attributeType", "CSS");
> > animate.setAttribute("repeatCount", "indefinite");
> >
> > rect.appendChild(animate);
> >
> > animate.beginElement();
> >
> >
> > but this didn't get animated, so I've tried to use the
> SVGAnimationEngine,
> but
> > I'm not sure how to use the addAnimation() method, or even if I need to
> do
> > that:
> >
> > SVGAnimationEngine aEngine = getSVGAnimationEngine();
> > aEngine.addAnimation((AnimationTarget) rect,
> > SVGAnimationEngine.ANIM_TYPE_CSS, "?", "?", AbstractAnimation???);
> >
> > How can I setup an AbstractAnimation?
> >
> >
> >
> > Any help is very appreciated
> >
> > Thanks in advance.
> >
> > Kind regards,
> >
> > Fabian
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail:
> batik-users-unsubscribe@xmlgraphics.apache.org<mailto:
> batik-users-unsubscribe@xmlgraphics.apache.org>
> > For additional commands, e-mail:
> batik-users-help@xmlgraphics.apache.org<mailto:
> batik-users-help@xmlgraphics.apache.org>
> >
> >
> >
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
>
Re: How to create a svg animate tag during runtime and animate it?
Posted by Fabian Unfried <in...@funfried.de>.
Hi Thomas,
thanks for your hints.
The canvas is in JSVGComponent.ALWAYS_DYNAMIC mode, our code for opening the
svg document looks like this:
// load svg file
String parser = XMLResourceDescriptor.getXMLParserClassName();
SAXSVGDocumentFactory df = new SAXSVGDocumentFactory(parser);
if (this.debug) log.debug(method + "used XML parser: '" + parser + "'");
try
{
this.docMap = (SVGOMDocument) df.createSVGDocument(svgURI); //
if (this.debug) log.debug(method + "SVG '" + svgFile + "' loaded
successful.");
}
catch (java.io.IOException ioe)
{
log.error(method + "Error while creating SVG Document:", ioe);
if (ioe.getMessage().indexOf("�") > 0)
{
log.error(method + "...(likely hex character at end of file!)");
}
throw ioe;
}
// get the root element
this.docMapRoot = this.docMap.getRootElement();
// access to CSS style of root element
this.docMapStyle = (SVGStylable) this.docMapRoot;
// add listener for zoom/resize
// available events: http://www.w3.org/TR/SVG11/interact.html
final EventTarget t = (EventTarget) this.docMapRoot;
t.addEventListener("SVGResize", new OnResizeAction(), false);
t.addEventListener("SVGScroll", new OnScrollAction(), false);
// setup the SVG document and svgCanvas take note of changes
this.svgCanvas.setDocumentState(SVGMapCanvas.ALWAYS_DYNAMIC);
this.svgCanvas.setSVGDocument(this.docMap);
Is the setDocumentState() call at the right place? Or do we do this too early
or too late?
What do you mean with "the timeline thing"?
Regards,
Fabian
> Hi Fabian,
>
> Fabian Unfried <in...@funfried.de> wrote on 03/15/2010 05:45:07 AM:
>
> > Maybe I didn't mention that exactly, my problem is that I have already
opened
> > a svg file in my application and then would like to add an animation, but
if
> > I do this like in your example, it won't be animated.
>
> I suspect the problem is that the canvas decided that it could use
> 'static' mode to render the document. If the Canvas does not see any
> dynamic elements/attributes in the document then it will not attach
> the necessary listeners/handlers to support dynamic modification of
> the document (including animation).
>
> You can force the canvas to be dynamic by calling
> the following _before_ loading the document:
>
> canvas.setDocumentState(JSVGComponent.ALWAYS_DYNAMIC)
>
> BTW it might also be the timeline thing (or both).
>
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by th...@kodak.com.
Hi Fabian,
Fabian Unfried <in...@funfried.de> wrote on 03/15/2010 05:45:07 AM:
> Maybe I didn't mention that exactly, my problem is that I have already
opened
> a svg file in my application and then would like to add an animation,
but if
> I do this like in your example, it won't be animated.
I suspect the problem is that the canvas decided that it could use
'static' mode to render the document. If the Canvas does not see any
dynamic elements/attributes in the document then it will not attach
the necessary listeners/handlers to support dynamic modification of
the document (including animation).
You can force the canvas to be dynamic by calling
the following _before_ loading the document:
canvas.setDocumentState(JSVGComponent.ALWAYS_DYNAMIC)
BTW it might also be the timeline thing (or both).
Re: How to create a svg animate tag during runtime and animate it?
Posted by Helder Magalhães <he...@gmail.com>.
Hi Fabian,
> first of all thanks for your reply, but if you create the elements (rect and
> animate) and then create the document and load it, it should be the same if
> you already drawn the elements in a svg file and open it.
Nope. :-p Actually, there is a key difference between having the
animation elements initially and creating them afterward: the
document's timeline has already begun for the ones initially present
in the document! That's why you need the 'begin' attribute plus
'beginElement()' "trickery", which is actually by design (according to
the SVG specification, if I'm not mistaken). ;-)
I'd suggest trying with the latest available source code [1] (you
didn't state if you were using the trunk source code or a
snapshot/previous release). If you are following the suggestions in
this thread and you can still can't animate things, I'd say attaching
a simple (reduced) test case would help. ;-)
> Kind Regards,
> Fabian
Hope this helps,
Helder
[1] http://xmlgraphics.apache.org/batik/download.cgi#Subversion+repository
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by Fabian Unfried <in...@funfried.de>.
Hi Jonathan,
first of all thanks for your reply, but if you create the elements (rect and
animate) and then create the document and load it, it should be the same if
you already drawn the elements in a svg file and open it.
Maybe I didn't mention that exactly, my problem is that I have already opened
a svg file in my application and then would like to add an animation, but if
I do this like in your example, it won't be animated.
Kind Regards,
Fabian
> Hi Fabian,
>
> It is usually a case of getting the correct attributes. Batik tends to
follow the standard a bit more closely that some other implementations. The
following code works for me...posted sans the JFrame init...assumes a class
member JSVGCanvas named svgCanvas.
>
> private void runDemo() {
> svgCanvas.setDocumentState(JSVGCanvas.ALWAYS_DYNAMIC);
> svgCanvas.addGVTTreeBuilderListener(new GVTTreeBuilderAdapter() {
> @Override
> public void gvtBuildCompleted(GVTTreeBuilderEvent e) {
>
svgCanvas.getUpdateManager().getUpdateRunnableQueue().invokeLater(new
Runnable() {
> public void run() {
> Element rect =
svgCanvas.getSVGDocument().createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
SVGConstants.SVG_RECT_TAG);
> rect.setAttributeNS(null,
SVGConstants.SVG_X_ATTRIBUTE, "100");
> rect.setAttributeNS(null,
SVGConstants.SVG_Y_ATTRIBUTE, "100");
> rect.setAttributeNS(null,
SVGConstants.SVG_WIDTH_ATTRIBUTE, "100");
> rect.setAttributeNS(null,
SVGConstants.SVG_HEIGHT_ATTRIBUTE, "100");
> rect.setAttributeNS(null,
SVGConstants.SVG_FILL_ATTRIBUTE, "#2222ee");
> Element animate =
svgCanvas.getSVGDocument().createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
SVGConstants.SVG_ANIMATE_TAG);
> animate.setAttributeNS(null,
SVGConstants.SVG_ATTRIBUTE_NAME_ATTRIBUTE,
SVGConstants.SVG_OPACITY_ATTRIBUTE);
> animate.setAttributeNS(null,
SVGConstants.SVG_VALUES_ATTRIBUTE, "1;0");
> animate.setAttributeNS(null,
SVGConstants.SVG_DUR_ATTRIBUTE, "3s");
> animate.setAttributeNS(null,
SVGConstants.SVG_REPEAT_COUNT_ATTRIBUTE, "indefinite");
> rect.appendChild(animate);
>
svgCanvas.getSVGDocument().getDocumentElement().appendChild(rect);
> }
> });
> }
> });
> Document doc =
SVGDOMImplementation.getDOMImplementation().createDocument(SVGDOMImplementation.SVG_NAMESPACE_URI, "svg",
null);
> svgCanvas.setSVGDocument((SVGDocument) doc);
> }
>
>
>
>
>
> On Fri, Mar 12, 2010 at 8:35 AM, Fabian Unfried
<in...@funfried.de>> wrote:
> Hi,
>
> I would like to know how to handle animations with batik, especially the
> animate tag.
>
> If I put the following svg code into an svg graphic and open it with a java
> application with batik all works just fine and it'll be animated:
>
> <rect x="100" y="100" width="500" height="500">
> <animate attributeType="CSS" attributeName="opacity"
calcMode="discrete"
> from="1" to="0" dur="1s" repeatCount="indefinite" />
> </rect>
>
>
> But what do I have to do, if I want to do exactly this during runtime?
>
> I've tried this:
>
>
> SVGOMAnimationElement animate = (SVGOMAnimationElement)
> this.svgDocument.createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> SVG12Constants.SVG_ANIMATE_TAG);
> animate.setAttribute("dur", "1s");
> animate.setAttribute("values", "0; 0; 1; 1");
> animate.setAttribute("keyTimes", "0; 0.5; 0.7; 1.0");
> animate.setAttribute("attributeName", "opacity");
> animate.setAttribute("attributeType", "CSS");
> animate.setAttribute("repeatCount", "indefinite");
>
> rect.appendChild(animate);
>
> animate.beginElement();
>
>
> but this didn't get animated, so I've tried to use the SVGAnimationEngine,
but
> I'm not sure how to use the addAnimation() method, or even if I need to do
> that:
>
> SVGAnimationEngine aEngine = getSVGAnimationEngine();
> aEngine.addAnimation((AnimationTarget) rect,
> SVGAnimationEngine.ANIM_TYPE_CSS, "?", "?", AbstractAnimation???);
>
> How can I setup an AbstractAnimation?
>
>
>
> Any help is very appreciated
>
> Thanks in advance.
>
> Kind regards,
>
> Fabian
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail:
batik-users-unsubscribe@xmlgraphics.apache.org<ma...@xmlgraphics.apache.org>
> For additional commands, e-mail:
batik-users-help@xmlgraphics.apache.org<ma...@xmlgraphics.apache.org>
>
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: How to create a svg animate tag during runtime and animate it?
Posted by jonathan wood <jo...@gmail.com>.
Hi Fabian,
It is usually a case of getting the correct attributes. Batik tends to
follow the standard a bit more closely that some other implementations. The
following code works for me...posted sans the JFrame init...assumes a class
member JSVGCanvas named svgCanvas.
private void runDemo() {
svgCanvas.setDocumentState(JSVGCanvas.ALWAYS_DYNAMIC);
svgCanvas.addGVTTreeBuilderListener(new GVTTreeBuilderAdapter() {
@Override
public void gvtBuildCompleted(GVTTreeBuilderEvent e) {
svgCanvas.getUpdateManager().getUpdateRunnableQueue().invokeLater(new
Runnable() {
public void run() {
Element rect =
svgCanvas.getSVGDocument().createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
SVGConstants.SVG_RECT_TAG);
rect.setAttributeNS(null,
SVGConstants.SVG_X_ATTRIBUTE, "100");
rect.setAttributeNS(null,
SVGConstants.SVG_Y_ATTRIBUTE, "100");
rect.setAttributeNS(null,
SVGConstants.SVG_WIDTH_ATTRIBUTE, "100");
rect.setAttributeNS(null,
SVGConstants.SVG_HEIGHT_ATTRIBUTE, "100");
rect.setAttributeNS(null,
SVGConstants.SVG_FILL_ATTRIBUTE, "#2222ee");
Element animate =
svgCanvas.getSVGDocument().createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
SVGConstants.SVG_ANIMATE_TAG);
animate.setAttributeNS(null,
SVGConstants.SVG_ATTRIBUTE_NAME_ATTRIBUTE,
SVGConstants.SVG_OPACITY_ATTRIBUTE);
animate.setAttributeNS(null,
SVGConstants.SVG_VALUES_ATTRIBUTE, "1;0");
animate.setAttributeNS(null,
SVGConstants.SVG_DUR_ATTRIBUTE, "3s");
animate.setAttributeNS(null,
SVGConstants.SVG_REPEAT_COUNT_ATTRIBUTE, "indefinite");
rect.appendChild(animate);
svgCanvas.getSVGDocument().getDocumentElement().appendChild(rect);
}
});
}
});
Document doc =
SVGDOMImplementation.getDOMImplementation().createDocument(SVGDOMImplementation.SVG_NAMESPACE_URI,
"svg", null);
svgCanvas.setSVGDocument((SVGDocument) doc);
}
On Fri, Mar 12, 2010 at 8:35 AM, Fabian Unfried <in...@funfried.de> wrote:
> Hi,
>
> I would like to know how to handle animations with batik, especially the
> animate tag.
>
> If I put the following svg code into an svg graphic and open it with a java
> application with batik all works just fine and it'll be animated:
>
> <rect x="100" y="100" width="500" height="500">
> <animate attributeType="CSS" attributeName="opacity"
> calcMode="discrete"
> from="1" to="0" dur="1s" repeatCount="indefinite" />
> </rect>
>
>
> But what do I have to do, if I want to do exactly this during runtime?
>
> I've tried this:
>
>
> SVGOMAnimationElement animate = (SVGOMAnimationElement)
> this.svgDocument.createElementNS(SVGDOMImplementation.SVG_NAMESPACE_URI,
> SVG12Constants.SVG_ANIMATE_TAG);
> animate.setAttribute("dur", "1s");
> animate.setAttribute("values", "0; 0; 1; 1");
> animate.setAttribute("keyTimes", "0; 0.5; 0.7; 1.0");
> animate.setAttribute("attributeName", "opacity");
> animate.setAttribute("attributeType", "CSS");
> animate.setAttribute("repeatCount", "indefinite");
>
> rect.appendChild(animate);
>
> animate.beginElement();
>
>
> but this didn't get animated, so I've tried to use the SVGAnimationEngine,
> but
> I'm not sure how to use the addAnimation() method, or even if I need to do
> that:
>
> SVGAnimationEngine aEngine = getSVGAnimationEngine();
> aEngine.addAnimation((AnimationTarget) rect,
> SVGAnimationEngine.ANIM_TYPE_CSS, "?", "?", AbstractAnimation???);
>
> How can I setup an AbstractAnimation?
>
>
>
> Any help is very appreciated
>
> Thanks in advance.
>
> Kind regards,
>
> Fabian
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
>