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 Sylvain Caillet <s....@free.fr> on 2005/02/16 14:15:04 UTC
How to apply more than 1 tranform to a SVGDocument
Hi to all !
I'm new to this mailing-list and glad now to work with Batik!
I have very simple SVG files (only simple graphics) to manage on an AWT panel (the panel already exists so i couldn't use the canvas provided by Batik). I have created a SVGObject class which create a SVGDocument with a SVG file byte stream. After, i have to create graphical function to translate, rotate, skew, ... these SVG.
I use the following code in my SVGObject.paint() method :
GVTBuilder gtv = new GVTBuilder();
GraphicsNode gn = gtv.build(myBridgeContext, mySVGDocument);
Graphics2D g2d = (Graphics2D)g.create(extent.x,extent.y,extent.x+extent.width,extent.y+extent.height);
gn.paint(g2d);
My question is :
- how could i apply some transformations to mySVGDocument before creating the updated graphics node to paint ?
I had a look to the SVGTransformList DOM interface but i could not find any method to get this object from my SVGDocument.
I you have an idea, or an example, it would be great !
Thank you all
Sylvain Caillet
PS : SVG example:
<svg width="600" height="600" scale1000="0.1" id="main" originx="300" originy="300">
<rect x="0" width="600" y="0" height="600" style="stroke:rgb(255,255,255);fill:rgb(255,0,0);"/>
<line y2="600" x1="0" style="stroke: rgb(255, 255, 255); " x2="600" y1="0"/>
<line y2="600" x1="600" style="stroke: rgb(255, 255, 255); " x2="0" y1="0"/>
</svg>
Re: How to apply more than 1 tranform to a SVGDocument
Posted by Thomas DeWeese <Th...@Kodak.com>.
Sylvain Caillet wrote:
> Thank you for the sample code. But i still have a problem. I can't cast
> my element to SVGTransformable interface because i get a
> SVGOMSVGElement which not implements this interface.
If you want to transform the entire document then the
best way to do this is to transform the Graphics before you
paint the document to it.
Graphics2D has a number of methods for adjusting it's
AffineTransform (scale, rotate, shear, translate). These
are all cumulative so you can apply any sequence of them
you want [of course you need to make sure that you understand
what is being transformed to what by these methods as
they are not transitive, A*B != B*A, or more directly
rotate(translate(...),...) != translate(rotate(...),...), but
this is not really an SVG issue it's an AffineTransform issue].
> How could i retrieve a SVGTransformable object from a SVGDocument or
> from an Element in a SVGDocument ?
You don't get one for the SVGElement. You could get one from
a G element which could be the only child of the root SVG (put all
the content inside a g) but really it's sounding to me like you
really want to modify the graphics before you draw to it.
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xml.apache.org
For additional commands, e-mail: batik-users-help@xml.apache.org
Re: How to apply more than 1 tranform to a SVGDocument
Posted by Sylvain Caillet <s....@free.fr>.
Hi !
Thank you for the sample code. But i still have a problem. I can't cast my
element to SVGTransformable interface because i get a
SVGOMSVGElement which not implements this interface.
The way i do it is :
Object obj = mySvgDoc.getDocumentElement();
and this object is a SVGOMSVGElement object.
How could i retrieve a SVGTransformable object from a SVGDocument or from an
Element in a SVGDocument ?
Best regards
Sylvain
----- Original Message -----
From: "Tonny Kohar" <to...@kiyut.com>
To: <ba...@xml.apache.org>
Sent: Wednesday, February 16, 2005 7:01 PM
Subject: Re: How to apply more than 1 tranform to a SVGDocument
> Hi,
>
>> My question is :
>> - how could i apply some transformations to mySVGDocument before
>> creating the updated graphics node to paint ?
>>
>> I had a look to the SVGTransformList DOM interface but i could not
>> find any method to get this object from my SVGDocument.
>> I you have an idea, or an example, it would be great !
>
> Here is the sample code to get SVGTransformList from an Element as in
> SVG DOM API
> SVGTransformList transformList =
> ((SVGTransformable)element).getTransform().getBaseVal();
>
> Then you can use the transformList to set transform stuff.
>
> Best Regards
> Tonny Kohar
>
> --
> Sketsa
> SVG Graphics Editor
> http://www.kiyut.com
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xml.apache.org
> For additional commands, e-mail: batik-users-help@xml.apache.org
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xml.apache.org
For additional commands, e-mail: batik-users-help@xml.apache.org
Re: How to apply more than 1 tranform to a SVGDocument
Posted by Tonny Kohar <to...@kiyut.com>.
Hi,
> My question is :
> - how could i apply some transformations to mySVGDocument before
> creating the updated graphics node to paint ?
>
> I had a look to the SVGTransformList DOM interface but i could not
> find any method to get this object from my SVGDocument.
> I you have an idea, or an example, it would be great !
Here is the sample code to get SVGTransformList from an Element as in
SVG DOM API
SVGTransformList transformList =
((SVGTransformable)element).getTransform().getBaseVal();
Then you can use the transformList to set transform stuff.
Best Regards
Tonny Kohar
--
Sketsa
SVG Graphics Editor
http://www.kiyut.com
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xml.apache.org
For additional commands, e-mail: batik-users-help@xml.apache.org
Re: How to apply more than 1 tranform to a SVGDocument
Posted by Andres Toussaint <an...@onemileup.com>.
Hi,
My own personal way of doing this would be to leave the
drawing-rendering to Batik, and retrieve the BufferedImage it produces.
To do so, you need a JSVGComponent (no need to add it into any
container) to which you add a GVTRenderingListener and a
UpdateListener. (see thread from feb.2005 with subject "drawing SVG on
a Canvas")
Once you have your SVG loaded, you need to apply your transformations
to your SVG document in the DOM using the <transform> attribute on your
SVG element. (make sure to do so in the UpdateManager thread. You can
capture the UpdateManager in the JSVGComponent once the GVTTree is
built).
When your document is transformed, a UpdateCompleted event will be
fired, from which you can recuperate the new BufferedImage that holds
your transformed SVG Document.
Snippet for running in the UpdateManager Thread:
updateManager.getUpdateRunnableQueue().invokeLater(new Runnable() {
public void run() {
yourSvgDocument.getDocumentElement.setAttribute("transform", "YOUR
TRANSFORM MATRIX HERE");
}
});
Regards,
Andres.
On Feb 16, 2005, at 8:15 AM, Sylvain Caillet wrote:
> Hi to all !
>
> I'm new to this mailing-list and glad now to work with Batik!
>
> I have very simple SVG files (only simple graphics) to manage on an
> AWT panel (the panel already exists so i couldn't use the canvas
> provided by Batik). I have created a SVGObject class which create a
> SVGDocument with a SVG file byte stream. After, i have to create
> graphical function to translate, rotate, skew, ... these SVG.
>
> I use the following code in my SVGObject.paint() method :
>
> GVTBuilder gtv = new GVTBuilder();
> GraphicsNode gn = gtv.build(myBridgeContext, mySVGDocument);
> Graphics2D g2d =
> (Graphics2D)g.create(extent.x,extent.y,extent.x+extent.width,extent.y+e
> xtent.height);
> gn.paint(g2d);
>
> My question is :
> - how could i apply some transformations to mySVGDocument before
> creating the updated graphics node to paint ?
>
> I had a look to the SVGTransformList DOM interface but i could not
> find any method to get this object from my SVGDocument.
> I you have an idea, or an example, it would be great !
>
> Thank you all
>
> Sylvain Caillet
>
> PS : SVG example:
> <svg width="600" height="600" scale1000="0.1" id="main" originx="300"
> originy="300">
> <rect x="0" width="600" y="0" height="600"
> style="stroke:rgb(255,255,255);fill:rgb(255,0,0);"/>
> <line y2="600" x1="0" style="stroke: rgb(255, 255, 255); "
> x2="600" y1="0"/>
> <line y2="600" x1="600" style="stroke: rgb(255, 255, 255); "
> x2="0" y1="0"/>
> </svg>