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 Keywan Najafi Tonekaboni <me...@prometoys.net> on 2008/04/08 18:19:23 UTC

Parsing SVG and grouping actions

Hi,

I work on a whiteboard for Jabber/XMPP. I use Batik and JSVGCanvas for
the GUI. I found in another whiteboard implementation [1] (which is not
using Batik) the class SVGUtil[2].

This class is a parser for SVG and connected with the other classes
doing the SVG, as far as I understand.

My question: Is there a ready parser from Batik available, which I could
use instead? 

Another question:

I draw something on the canvas with this code:

		svgG2D.setPaint(new Color(color.getRed(), color.getGreen(),
color.getBlue(), 64));
			svgG2D.fill(shape);
			svgG2D.setPaint(Color.BLACK);
			svgG2D.setStroke(new BasicStroke((float)1.5));
			svgG2D.draw(shape);
//			svgG2D.drawString("Keywan - 12.3.2007", (float)start.getX()+5,
(float)start.getY()+5); 
			Element root = doc.getDocumentElement();
			svgG2D.getRoot(root);

Can I group it somehow to one parent element, which I could append to my
jabber messages and send it.. I recognised, that the above code created
stanzas like this in the SVG-file:

<!--Generated by the Batik Graphics2D SVG Generator-->
<defs id="genericDefs"/>
<g>
<g stroke-width="1.5">
<rect fill="none" x="637" width="17" height="15" y="450"/>
</g>
<g fill="rgb(255,0,0)" stroke-width="1.5" fill-opacity="0.251"
stroke-opacity="0.251" stroke="rgb(255,0,0)">
<rect x="637" width="17" height="15" y="450" stroke="none"/>
</g>
</g>

If I could grab this parent-<g>, this would help me a much.

Am I on the wrong track?

Regards,

Keywan

[1] http://version2software.com/v2whiteboard.html
[2] http://www.prometoys.net/downloads/svg/SVGUtil.java






---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org


RE: Parsing SVG and grouping actions

Posted by Keywan Najafi Tonekaboni <li...@prometoys.net>.
Hi Thomas,

thank you very much. Your tipps was the solution. Now everything works
great :D

Regards,

Keywan

-- 
Keywan Najafi Tonekaboni
http://www.prometoys.net

people@world:/# apt-get --purge remove dominion
After unpacking world will be freed.
You are about to do something potentially beneficial
To continue type in the phrase 'Yes, do as We say!'


---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org


RE: Parsing SVG and grouping actions

Posted by th...@kodak.com.
Hi Keywan,

Keywan Najafi Tonekaboni <li...@prometoys.net> wrote on 04/12/2008 
09:25:49 AM:

> I deleted SVGGraphics2D from my code and try it now with DOM. I have the
> famous problem, that the JSVGCanvas didn't update. 

>    String svgNS = SVGDOMImplementation.SVG_NAMESPACE_URI;
[...]
>    Element g = doc.createElement("g");
[...]
>    Element image = doc.createElement("image");

   Your createElement calls need to be createElementNS
with the SVG Namespace:

        Element g = doc.createElementNS(svgNS, "g");
[...]
>    Element image = doc.createElementNS(svgNS,"image");


>    image.setAttribute("id", "ScannedDocument");

    To be technically correct this should be

        image.setAttributeNS(null, "id", "ScannedDocument");

>    image.setAttribute("xmlns:xlink","http://www.w3.org/1999/xlink");

      This isn't really correct it should be:
        String xlinkNS = "http://www.w3.org/1999/xlink";
        image.setAttributeNS(xmlNS, "xmlns:xlink", xlinkNS);

>    image.setAttribute("xlink:href",pngBase64);

        And this should be:
        image.setAttributeNS(xlinkNS, "xlink:href",pngBase64);

> I don't run it in the UpdateManager, because at this state JSVGCanvas
> don't has any Document associated and so no Update Manager is available.
> This is correct, or?

   Correct, the problem is that you were adding elements that weren't
SVG elements (because they aren't in the SVG namespace) so the document
ignored the added elements.

> Another question is about Document.getElementById()
> Can I use it with SVGDocument? When I do this, I got a
> NullPointerException:

   Probably because unless the elements are SVG element's the
document can't tell that the 'id' attribute is of type #ID.

> When I want to remove a shape from the document, is it enough to grab
> the element and then call "doc.removeChild(element);"? 

    No, because doc is not the parent of 'element'.  you can
call element.getParentNode().removeChild(element)

RE: Parsing SVG and grouping actions

Posted by Keywan Najafi Tonekaboni <li...@prometoys.net>.
Hi,

first of all, thank you for the tips and help and the patience you help
here everybody. 

I deleted SVGGraphics2D from my code and try it now with DOM. I have the
famous problem, that the JSVGCanvas didn't update. I try with the help
of the documentation, a Batik book and the mailing list archive to solve
the problem, but couldn't find the source of it.

When I try to load a SVG from file, the Canvas load the SVG, but after
this no changes are draw:

String parser = XMLResourceDescriptor.getXMLParserClassName();
SAXSVGDocumentFactory factory = new SAXSVGDocumentFactory(parser);
SVGDocument doc = (SVGDocument)
	factory.createDocument(file.toURI().toString());
jSVGCanvasBackground.setSVGDocument(doc);

I do all the changes in a Runnable. This Runnable is atteched to the
update Manager.

UpdateManager um = jSVGCanvasBackground.getUpdateManager();
Runnable r = new CodilirePainter(model, pm, from_remote);
um.getUpdateRunnableQueue().invokeLater(r);

CodilirePainter is my own class, which implements Runnable.

When I try to create a new SVG with a PNG inside it even don't show me
this file. But I can add shapes etc with no problems. I only cant see
them in the canvas. But when I save the file and open it again, with my
program or any other (texteditor, inkscape), the document is like i want
it and with the added shapes.

File is my PNG, read from disk:

private void genSVG(File file) throws IOException {
	
	DOMImplementation impl = SVGDOMImplementation.getDOMImplementation();
	String svgNS = SVGDOMImplementation.SVG_NAMESPACE_URI;
	SVGDocument doc = (SVGDocument) impl.createDocument(svgNS, "svg", null);
			
	
	// encode the png to Base64 to embed it
	String pngBase64 = createPNGB64String(file);
	
	String width = Integer.toString(model.getSize().width);
	String height = Integer.toString(model.getSize().height);
	Element root = doc.getDocumentElement();
	root.setAttribute("width", width);
	root.setAttribute("height", height);
	root.setAttribute("viewBox", "0 0 " + width + " " + height);
	
	Element g = doc.createElement("g");
	g.setAttribute("id", "background");
	Element image = doc.createElement("image");
	image.setAttribute("id", "ScannedDocument");
	image.setAttribute("x", "0");
	image.setAttribute("y", "0");
	image.setAttribute("width", width);
	image.setAttribute("height", height);	
	image.setAttribute("xmlns:xlink","http://www.w3.org/1999/xlink");
	image.setAttribute("xlink:href",pngBase64);
	image.setAttribute("xlink:show","embed");
	image.setAttribute("xlink:type","simple");
	image.setAttribute("xlink:actuate","onLoad");

	g.appendChild(image);
	root.appendChild(g);
	
	jSVGCanvasBackground.setSVGDocument(doc);
}

I don't run it in the UpdateManager, because at this state JSVGCanvas
don't has any Document associated and so no Update Manager is available.
This is correct, or?

Did I forgot something, that UpdateManager works? 

Another question is about Document.getElementById()
Can I use it with SVGDocument? When I do this, I got a
NullPointerException:

Element element = doc.getElementById(id);

When I want to remove a shape from the document, is it enough to grab
the element and then call "doc.removeChild(element);"? Or is it better
to use SAX?


Regards,

Keywan


-- 
Keywan Najafi Tonekaboni
http://www.prometoys.net

people@world:/# apt-get --purge remove dominion
After unpacking world will be freed.
You are about to do something potentially beneficial
To continue type in the phrase 'Yes, do as We say!'


---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org


RE: Parsing SVG and grouping actions

Posted by Keywan Najafi Tonekaboni <li...@prometoys.net>.
Hi Michael,

Am Dienstag, den 08.04.2008, 13:49 -0400 schrieb Bishop, Michael W.
CONTR J9C880:

> Our whiteboard implementation is done with Batik.  I don't use the
> SVGGraphics2D to draw; rather I translate mouse clicks and gestures
> and directly append events to the DOM.  For a rectangle, I'd capture
> the X/Y of the mouse pressed, the X/Y of the mouse released, translate
> the coordinates to the SVGDocument and create an Element based on
> that.
>  
> I'd started with using SVGGraphics2D and found it wasn't the way to go
> and with a lot of help from this list, got started on the
> implementation we have today.  I think your questions will be
> invalidated if you go this route.  SVGGraphics2D is really intended to
> render an entire document at once, not a create/update/delete model.

I guessed this. But for me was SVGGraphics2D much easier to implement.
Anyway, must learn to implement it the other way.
>  
> Our XMPP Client (with Whiteboard) can be found at
> https://xmpp.je.jfcom.mil/ and our submitted spec (written last year,
> not in 2001; the date's wrong) can be found at
> http://www.xmpp.org/extensions/inbox/whiteboard2.html.
>  

It looks interesting. I didn't found this client due to my research. Is
there any source available?

Regards,

Keywan

-- 
Keywan Najafi Tonekaboni
http://www.prometoys.net

people@world:/# apt-get --purge remove dominion
After unpacking world will be freed.
You are about to do something potentially beneficial
To continue type in the phrase 'Yes, do as We say!'


---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org


RE: Parsing SVG and grouping actions

Posted by th...@kodak.com.
Hi Michael, Keywan

"Bishop, Michael W. CONTR J9C880" <Mi...@je.jfcom.mil> wrote on 
04/08/2008 01:49:10 PM:

> I'd started with using SVGGraphics2D and found it wasn't the way to 
> go and with a lot of help from this list, got started on the 
> implementation we have today.  I think your questions will be 
> invalidated if you go this route.  SVGGraphics2D is really intended 
> to render an entire document at once, not a create/update/delete model.

   This is correct, the SVG Graphics2D is really intended as a way to
capture existing drawing code into SVG.  The SVGGraphics2D is a heavy
weight way to generate SVG elements.  Using createElementNS and 
setAttributeNS is genereally only slightly more verbose code and
will generally produce cleaner (and hence probably faster to render
and easier to manage) documents.

RE: Parsing SVG and grouping actions

Posted by "Bishop, Michael W. CONTR J9C880" <Mi...@je.jfcom.mil>.
Hi,

Our whiteboard implementation is done with Batik.  I don't use the SVGGraphics2D to draw; rather I translate mouse clicks and gestures and directly append events to the DOM.  For a rectangle, I'd capture the X/Y of the mouse pressed, the X/Y of the mouse released, translate the coordinates to the SVGDocument and create an Element based on that.

I'd started with using SVGGraphics2D and found it wasn't the way to go and with a lot of help from this list, got started on the implementation we have today.  I think your questions will be invalidated if you go this route.  SVGGraphics2D is really intended to render an entire document at once, not a create/update/delete model.

Our XMPP Client (with Whiteboard) can be found at https://xmpp.je.jfcom.mil/ and our submitted spec (written last year, not in 2001; the date's wrong) can be found at http://www.xmpp.org/extensions/inbox/whiteboard2.html.

Michael Bishop



From: Keywan Najafi Tonekaboni
Sent: Tue 4/8/2008 12:19 PM
To: batik-users@xmlgraphics.apache.org
Subject: Parsing SVG  and grouping actions


Hi,

I work on a whiteboard for Jabber/XMPP. I use Batik and JSVGCanvas for
the GUI. I found in another whiteboard implementation [1] (which is not
using Batik) the class SVGUtil[2].

This class is a parser for SVG and connected with the other classes
doing the SVG, as far as I understand.

My question: Is there a ready parser from Batik available, which I could
use instead? 

Another question:

I draw something on the canvas with this code:

		svgG2D.setPaint(new Color(color.getRed(), color.getGreen(),
color.getBlue(), 64));
			svgG2D.fill(shape);
			svgG2D.setPaint(Color.BLACK);
			svgG2D.setStroke(new BasicStroke((float)1.5));
			svgG2D.draw(shape);
//			svgG2D.drawString("Keywan - 12.3.2007", (float)start.getX()+5,
(float)start.getY()+5); 
			Element root = doc.getDocumentElement();
			svgG2D.getRoot(root);

Can I group it somehow to one parent element, which I could append to my
jabber messages and send it.. I recognised, that the above code created
stanzas like this in the SVG-file:

<!--Generated by the Batik Graphics2D SVG Generator-->
<defs id="genericDefs"/>
<g>
<g stroke-width="1.5">
<rect fill="none" x="637" width="17" height="15" y="450"/>
</g>
<g fill="rgb(255,0,0)" stroke-width="1.5" fill-opacity="0.251"
stroke-opacity="0.251" stroke="rgb(255,0,0)">
<rect x="637" width="17" height="15" y="450" stroke="none"/>
</g>
</g>

If I could grab this parent-<g>, this would help me a much.

Am I on the wrong track?

Regards,

Keywan

[1] http://version2software.com/v2whiteboard.html
[2] http://www.prometoys.net/downloads/svg/SVGUtil.java






---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org

Re: Parsing SVG and grouping actions

Posted by th...@kodak.com.
Hi Keywan,

Keywan Najafi Tonekaboni <me...@prometoys.net> wrote on 04/08/2008 12:19:23 
PM:

> I work on a whiteboard for Jabber/XMPP. I use Batik and JSVGCanvas for
> the GUI. I found in another whiteboard implementation [1] (which is not
> using Batik) the class SVGUtil[2].
> 
> This class is a parser for SVG and connected with the other classes
> doing the SVG, as far as I understand.
> 
> My question: Is there a ready parser from Batik available, which I could
> use instead? 

   Yes and probably (yes there is a parser from Batik, and probably 
you should use it instead).  It depends a lot on what you are trying
to do.  Since SVG is based on XML the parser is really any XML parser,
the more important part is that the XML parser use the Batik SVG Document
implementation to build the document (otherwise we will clone the
document when you ask Batik to do anything with it).

   Our parser is org.apache.batik.dom.svg.SAXSVGDocumentFactory.

> I draw something on the canvas with this code:
>          svgG2D.draw(shape);
>          Element root = doc.getDocumentElement();
>          svgG2D.getRoot(root);

   You can use:
        Element group = doc.createElementNS(SVG_NS, "g");
        svgG2D.getRoot(group);

> Can I group it somehow to one parent element, which I could append to my
> jabber messages and send it.. I recognised, that the above code created
> stanzas like this in the SVG-file:

    This will make the stanza a child of the created group.
Be aware that you need to append that group to the root
of it to also show up in the rendering:
 
        doc.getDocumentElement().appendChild(group);