Hi Ruben,
   In general Batik will do that, it's just that you got unlucky. We don't support trying to change the width and height of the container after the document is loaded (it's not entirely clear if it's needed by the SVG spec), if you think about it you should be able to see that handling changes inside the canvas is quite different from changes inside the document affecting how the swing component holding the document is laid out in the swing tree (not to mention that the swing tree doesn't make it easy to change layout like this).

   Changing the color of elements in the document can be done this way and they will automatically render themselves.


On Jan 7, 2013, at 8:19 PM, Rubén Pérez <ruben@astraia.com> wrote:


Thanks for your response.

I think I got Batik wrong, sorry I'm noob with DOM and Batik. I was expecting Batik to intercept the events from DOM, so it is aware when something in the XML changed and render what needed again. Can't I do that? Then if I want to change, lets say the colour of my form, what would be the proper way to achieve that? Do I really need to override all the internal Canvas functions that performs the render of my object?


On 01/08/2013 12:23 AM, DeWeese Thomas wrote:
Hi Ruben,
   I think this is really late to be setting the width of the root SVG element.  If you want to go this route you would probably need to load the XML yourself, update the width and then pass the XML DOM to the canvas.

   Alternately I would suggest overriding setMySize on the JSVGCanvas so that it ignores the size from the SVG document so that it is statically sized (well really just respecting the normal Swing layout rules).


On Jan 7, 2013, at 9:22 AM, Rubén Pérez <ruben@astraia.com> wrote:


I'm in Mac (I read there are some problems in Mac so it might be actually my problem, but I'd like to confirm that with you guys).

I have a JPanel with a BorderLayout in which I have added on the EAST area a JSVGCanvas loading a small arrow (originally on the file is 65px width). I want to load that arrow but resized to 100px.

I simply can't achieve this. When I run my code, the JSVGCanvas measures 69px width instead of the 100px, and there is nothing on it, it's just the panel empty with my orange background.

Here is basically what I'm doing:

private void changeWidth(final JSVGCanvas form, final int size) {
Runnable cmd=new Runnable() {
public void run() {
Element svgRoot = form.getSVGDocument().getDocumentElement();
svgRoot.setAttributeNS(null, "width", String.valueOf(size));


private JSVGCanvas buildArrow() {
try {
String parser = XMLResourceDescriptor.getXMLParserClassName();
SAXSVGDocumentFactory f = new SAXSVGDocumentFactory(parser);
URI uri = this.getClass().getResource("/com/myapp/app/dicomview/player/arrow.svg").toURI();
final SVGDocument doc = (SVGDocument) f.createDocument(uri.toString());
Element svgRoot = doc.getDocumentElement();
final JSVGCanvas arrow=new JSVGCanvas();


Color inst=new Color(Color.orange.getRed(), Color.orange.getGreen(), Color.orange.getBlue(), 75);
arrow.setBackground( inst );
arrow.addGVTTreeBuilderListener(new GVTTreeBuilderAdapter() {
public void gvtBuildCompleted(GVTTreeBuilderEvent e) {
changeWidth(arrow, 100);


add(arrow, BorderLayout.EAST);

return arrow;
} catch (Throwable ex) {
return null;

Can anybody please give me a hint in what could be going wrong?