You are viewing a plain text version of this content. The canonical link for it is here.
Posted to batik-dev@xmlgraphics.apache.org by Philippe Converset <pc...@Qarbon.com> on 2001/04/03 02:26:18 UTC

creating a SVG document programaticaly ?

Hi,

I'm completely new to Batik and I am trying to find a way to create from 
scratch a SVG document in my program in order to render it in a JSVGCanvas 
(think of it as if I was writing an authoring tool like Jasc WebDraw).
As far as I could understood all the impressive Batik packages, it seems 
that I need to create a SVGOMDocument and append a child on the root node. 
Is there any sample of this operation? I'm sure it's not as simple as that!

Any help appreciated.

Philippe


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


Re: creating a SVG document programaticaly ?

Posted by Vincent Hardy <vh...@eng.sun.com>.
Philippe Converset wrote:
> 
> Thanks for your quick answer,
> 
> I know that I could use the SVGGraphics2D, but I actually want to create
> the SVGDocument using the DOM. The purpose of that is being able to add a
> new graphics in an already existing document using the fastest way (and not
> the easiest). But the problem is that my code sample does not work. Any
> idea of what I did wrong in the DOM manipulation?

The SVGGraphics2D only uses the Document you give it to create
new elements. If you want to stick in content you have created, you
can use the setTopLevelGroup method on SVGGraphics2D.

V.
> 
> Philippe
> 
> At 04:35 PM 4/3/2001 -0700, you wrote:
> >Philippe,
> >
> >Actually, for the example you give, you do not need the SVGGraphics2D
> >generator at all, as you are building your document completely through
> >the DOM and you are only using SVGGraphics2D to serialize it.
> >
> >However, you could also use the SVGGraphics2D generator for what you
> >want:
> >
> >.  Use SVGGraphics2D instead of the DOM to create your SVG. For example,
> >    you could:
> >
> >    // ... Build SVGGraphics2D as in your current code.
> >    svgGenerator.setPaint(Color.black);
> >    Ellipse2D ellipse = new Ellipse2D.Float(8.5, 18.5, 3, 3);
> >    svgGenerator.fill(ellipse);
> >
> >    // ...
> >    svgGenerator.stream("test.svg", false);
> >
> >
> >I hope this helps.
> >V.
> >
> >Philippe Converset wrote:
> > >
> > > Hi,
> > >
> > > Your previous guess was right, here is what I want to do : the user
> > > draws something which is translated into a bunch of Graphics2D draw
> > > commands immediately and instead of having to be able to "record"
> > > those drawing commands, the SVGGraphics2D "record" them into an SVG
> > > DOM tree.
> > >
> > > But I'm still having problems trying to create a SVG document
> > > programmaticaly. So I did a simple test which adds a simple ellipse in
> > > a blank SVG document and uses SVGGraphics2D features to generate the
> > > SVG file, but all I get is this :
> > >
> > > <?xml version="1.0" encoding="ISO-8859-1"?>
> > > <!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 20001102//EN'
> > > 'http://www.w3.org/TR/2000/CR-SVG-20001102/DTD/svg-20001102.dtd'>
> > > <svg style="stroke-dasharray:none; shape-rendering:auto;
> > > font-family:&apos;Arial&apos;; text-rendering:auto; fill-opacity:1;
> > > color-rendering:auto; color-interpolation:sRGB; font-size:12;
> > > fill:black; stroke:black; image-rendering:auto; stroke-miterlimit:10;
> > > stroke-linecap:square; stroke-linejoin:miter; font-style:normal;
> > > stroke-width:1; stroke-dashoffset:0; font-weight:normal;
> > > stroke-opacity:1;" xmlns="http://www.w3.org/2000/svg" width="200"
> > > contentScriptType="text/ecmascript" preserveAspectRatio="xMidYMid
> > > meet" zoomAndPan="magnify" contentStyleType="text/css" height="200">
> > >   <!--Generated by the Batik Graphics2D SVG Generator-->
> > >   <defs id="genericDefs" />
> > >   <g />
> > > </svg>
> > >
> > > I can't see the ellipse in this file!
> > > I'm sure I made a mistake somewhere in this code that generates the
> > > file:
> > >
> > >   public void createSVGSample(Dimension size)
> > >   {
> > >     SVGGraphics2D svgGenerator;
> > >     Element ellipse;
> > >     Element group;
> > >     Element svgElement;
> > >
> > >
> > >
> > CSSDocumentHandler.setParserClassName("org.apache.batik.css.parser.Parser");
> > >     DOMImplementation impl =
> > > SVGDOMImplementation.getDOMImplementation();
> > >     String namespaceURI = SVGDOMImplementation.SVG_NAMESPACE_URI;
> > >     SVGDocument document =
> > > (SVGDocument)impl.createDocument(namespaceURI, "svg", null);
> > >
> > >     // Asuming the first child has the SVG tag
> > >     svgElement = (Element)document.getFirstChild();
> > >     group =
> > >
> > document.createElementNS(SVGConstants.SVG_NAMESPACE_URI,SVGConstants.SVG_G_TAG);
> > >     ellipse =
> > >
> > document.createElementNS(SVGConstants.SVG_NAMESPACE_URI,SVGConstants.SVG_ELLIPSE_TAG);
> > >     ellipse.setAttributeNS(null, SVGConstants.SVG_WIDTH_ATTRIBUTE,"" +
> > > 3);
> > >     ellipse.setAttributeNS(null, SVGConstants.SVG_RX_ATTRIBUTE ,"" +
> > > 10);
> > >     ellipse.setAttributeNS(null, SVGConstants.SVG_RY_ATTRIBUTE ,"" +
> > > 20);
> > >     svgElement.appendChild(group);
> > >     group.appendChild(ellipse);
> > >
> > >     try
> > >     {
> > >       svgGenerator = new SVGGraphics2D(document);
> > >       svgGenerator.setSVGCanvasSize(size);
> > >       svgGenerator.stream("test.svg",true);
> > >     }
> > >     catch(Exception e)
> > >     {
> > >     }
> > >   }
> > >
> > > Thanks for your help.
> > >
> > > By the way, is there any archive for this mailing list?
> > >
> > > Philippe
> >
> >---------------------------------------------------------------------
> >To unsubscribe, e-mail: batik-dev-unsubscribe@xml.apache.org
> >For additional commands, e-mail: batik-dev-help@xml.apache.org
> 
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-dev-unsubscribe@xml.apache.org
> For additional commands, e-mail: batik-dev-help@xml.apache.org

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


Re: creating a SVG document programaticaly ?

Posted by Philippe Converset <pc...@Qarbon.com>.
Thanks for your quick answer,

I know that I could use the SVGGraphics2D, but I actually want to create 
the SVGDocument using the DOM. The purpose of that is being able to add a 
new graphics in an already existing document using the fastest way (and not 
the easiest). But the problem is that my code sample does not work. Any 
idea of what I did wrong in the DOM manipulation?

Philippe

At 04:35 PM 4/3/2001 -0700, you wrote:
>Philippe,
>
>Actually, for the example you give, you do not need the SVGGraphics2D
>generator at all, as you are building your document completely through
>the DOM and you are only using SVGGraphics2D to serialize it.
>
>However, you could also use the SVGGraphics2D generator for what you
>want:
>
>.  Use SVGGraphics2D instead of the DOM to create your SVG. For example,
>    you could:
>
>    // ... Build SVGGraphics2D as in your current code.
>    svgGenerator.setPaint(Color.black);
>    Ellipse2D ellipse = new Ellipse2D.Float(8.5, 18.5, 3, 3);
>    svgGenerator.fill(ellipse);
>
>    // ...
>    svgGenerator.stream("test.svg", false);
>
>
>I hope this helps.
>V.
>
>Philippe Converset wrote:
> >
> > Hi,
> >
> > Your previous guess was right, here is what I want to do : the user
> > draws something which is translated into a bunch of Graphics2D draw
> > commands immediately and instead of having to be able to "record"
> > those drawing commands, the SVGGraphics2D "record" them into an SVG
> > DOM tree.
> >
> > But I'm still having problems trying to create a SVG document
> > programmaticaly. So I did a simple test which adds a simple ellipse in
> > a blank SVG document and uses SVGGraphics2D features to generate the
> > SVG file, but all I get is this :
> >
> > <?xml version="1.0" encoding="ISO-8859-1"?>
> > <!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 20001102//EN'
> > 'http://www.w3.org/TR/2000/CR-SVG-20001102/DTD/svg-20001102.dtd'>
> > <svg style="stroke-dasharray:none; shape-rendering:auto;
> > font-family:&apos;Arial&apos;; text-rendering:auto; fill-opacity:1;
> > color-rendering:auto; color-interpolation:sRGB; font-size:12;
> > fill:black; stroke:black; image-rendering:auto; stroke-miterlimit:10;
> > stroke-linecap:square; stroke-linejoin:miter; font-style:normal;
> > stroke-width:1; stroke-dashoffset:0; font-weight:normal;
> > stroke-opacity:1;" xmlns="http://www.w3.org/2000/svg" width="200"
> > contentScriptType="text/ecmascript" preserveAspectRatio="xMidYMid
> > meet" zoomAndPan="magnify" contentStyleType="text/css" height="200">
> >   <!--Generated by the Batik Graphics2D SVG Generator-->
> >   <defs id="genericDefs" />
> >   <g />
> > </svg>
> >
> > I can't see the ellipse in this file!
> > I'm sure I made a mistake somewhere in this code that generates the
> > file:
> >
> >   public void createSVGSample(Dimension size)
> >   {
> >     SVGGraphics2D svgGenerator;
> >     Element ellipse;
> >     Element group;
> >     Element svgElement;
> >
> >
> > 
> CSSDocumentHandler.setParserClassName("org.apache.batik.css.parser.Parser");
> >     DOMImplementation impl =
> > SVGDOMImplementation.getDOMImplementation();
> >     String namespaceURI = SVGDOMImplementation.SVG_NAMESPACE_URI;
> >     SVGDocument document =
> > (SVGDocument)impl.createDocument(namespaceURI, "svg", null);
> >
> >     // Asuming the first child has the SVG tag
> >     svgElement = (Element)document.getFirstChild();
> >     group =
> > 
> document.createElementNS(SVGConstants.SVG_NAMESPACE_URI,SVGConstants.SVG_G_TAG);
> >     ellipse =
> > 
> document.createElementNS(SVGConstants.SVG_NAMESPACE_URI,SVGConstants.SVG_ELLIPSE_TAG);
> >     ellipse.setAttributeNS(null, SVGConstants.SVG_WIDTH_ATTRIBUTE,"" +
> > 3);
> >     ellipse.setAttributeNS(null, SVGConstants.SVG_RX_ATTRIBUTE ,"" +
> > 10);
> >     ellipse.setAttributeNS(null, SVGConstants.SVG_RY_ATTRIBUTE ,"" +
> > 20);
> >     svgElement.appendChild(group);
> >     group.appendChild(ellipse);
> >
> >     try
> >     {
> >       svgGenerator = new SVGGraphics2D(document);
> >       svgGenerator.setSVGCanvasSize(size);
> >       svgGenerator.stream("test.svg",true);
> >     }
> >     catch(Exception e)
> >     {
> >     }
> >   }
> >
> > Thanks for your help.
> >
> > By the way, is there any archive for this mailing list?
> >
> > Philippe
>
>---------------------------------------------------------------------
>To unsubscribe, e-mail: batik-dev-unsubscribe@xml.apache.org
>For additional commands, e-mail: batik-dev-help@xml.apache.org


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


Re: creating a SVG document programaticaly ?

Posted by Vincent Hardy <vh...@eng.sun.com>.
Philippe,

Actually, for the example you give, you do not need the SVGGraphics2D
generator at all, as you are building your document completely through
the DOM and you are only using SVGGraphics2D to serialize it. 

However, you could also use the SVGGraphics2D generator for what you
want:

.  Use SVGGraphics2D instead of the DOM to create your SVG. For example,
   you could:

   // ... Build SVGGraphics2D as in your current code.
   svgGenerator.setPaint(Color.black);
   Ellipse2D ellipse = new Ellipse2D.Float(8.5, 18.5, 3, 3);
   svgGenerator.fill(ellipse);

   // ... 
   svgGenerator.stream("test.svg", false);


I hope this helps.
V.

Philippe Converset wrote:
> 
> Hi,
> 
> Your previous guess was right, here is what I want to do : the user
> draws something which is translated into a bunch of Graphics2D draw
> commands immediately and instead of having to be able to "record"
> those drawing commands, the SVGGraphics2D "record" them into an SVG
> DOM tree.
> 
> But I'm still having problems trying to create a SVG document
> programmaticaly. So I did a simple test which adds a simple ellipse in
> a blank SVG document and uses SVGGraphics2D features to generate the
> SVG file, but all I get is this :
> 
> <?xml version="1.0" encoding="ISO-8859-1"?>
> <!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 20001102//EN'
> 'http://www.w3.org/TR/2000/CR-SVG-20001102/DTD/svg-20001102.dtd'>
> <svg style="stroke-dasharray:none; shape-rendering:auto;
> font-family:&apos;Arial&apos;; text-rendering:auto; fill-opacity:1;
> color-rendering:auto; color-interpolation:sRGB; font-size:12;
> fill:black; stroke:black; image-rendering:auto; stroke-miterlimit:10;
> stroke-linecap:square; stroke-linejoin:miter; font-style:normal;
> stroke-width:1; stroke-dashoffset:0; font-weight:normal;
> stroke-opacity:1;" xmlns="http://www.w3.org/2000/svg" width="200"
> contentScriptType="text/ecmascript" preserveAspectRatio="xMidYMid
> meet" zoomAndPan="magnify" contentStyleType="text/css" height="200">
>   <!--Generated by the Batik Graphics2D SVG Generator-->
>   <defs id="genericDefs" />
>   <g />
> </svg>
> 
> I can't see the ellipse in this file!
> I'm sure I made a mistake somewhere in this code that generates the
> file:
> 
>   public void createSVGSample(Dimension size)
>   {
>     SVGGraphics2D svgGenerator;
>     Element ellipse;
>     Element group;
>     Element svgElement;
> 
> 
> CSSDocumentHandler.setParserClassName("org.apache.batik.css.parser.Parser");
>     DOMImplementation impl =
> SVGDOMImplementation.getDOMImplementation();
>     String namespaceURI = SVGDOMImplementation.SVG_NAMESPACE_URI;
>     SVGDocument document =
> (SVGDocument)impl.createDocument(namespaceURI, "svg", null);
> 
>     // Asuming the first child has the SVG tag
>     svgElement = (Element)document.getFirstChild();
>     group =
> document.createElementNS(SVGConstants.SVG_NAMESPACE_URI,SVGConstants.SVG_G_TAG);
>     ellipse =
> document.createElementNS(SVGConstants.SVG_NAMESPACE_URI,SVGConstants.SVG_ELLIPSE_TAG);
>     ellipse.setAttributeNS(null, SVGConstants.SVG_WIDTH_ATTRIBUTE,"" +
> 3);
>     ellipse.setAttributeNS(null, SVGConstants.SVG_RX_ATTRIBUTE ,"" +
> 10);
>     ellipse.setAttributeNS(null, SVGConstants.SVG_RY_ATTRIBUTE ,"" +
> 20);
>     svgElement.appendChild(group);
>     group.appendChild(ellipse);
> 
>     try
>     {
>       svgGenerator = new SVGGraphics2D(document);
>       svgGenerator.setSVGCanvasSize(size);
>       svgGenerator.stream("test.svg",true);
>     }
>     catch(Exception e)
>     {
>     }
>   }
> 
> Thanks for your help.
> 
> By the way, is there any archive for this mailing list?
> 
> Philippe

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


Re: creating a SVG document programaticaly ?

Posted by Philippe Converset <pc...@Qarbon.com>.
Hi,

Your previous guess was right, here is what I want to do : the user draws 
something which is translated into a bunch of Graphics2D draw commands 
immediately and instead of having to be able to "record" those drawing 
commands, the SVGGraphics2D "record" them into an SVG DOM tree.

But I'm still having problems trying to create a SVG document 
programmaticaly. So I did a simple test which adds a simple ellipse in a 
blank SVG document and uses SVGGraphics2D features to generate the SVG 
file, but all I get is this :

<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 20001102//EN' 
'http://www.w3.org/TR/2000/CR-SVG-20001102/DTD/svg-20001102.dtd'>
<svg style="stroke-dasharray:none; shape-rendering:auto; 
font-family:&apos;Arial&apos;; text-rendering:auto; fill-opacity:1; 
color-rendering:auto; color-interpolation:sRGB; font-size:12; fill:black; 
stroke:black; image-rendering:auto; stroke-miterlimit:10; 
stroke-linecap:square; stroke-linejoin:miter; font-style:normal; 
stroke-width:1; stroke-dashoffset:0; font-weight:normal; stroke-opacity:1;" 
xmlns="http://www.w3.org/2000/svg" width="200" 
contentScriptType="text/ecmascript" preserveAspectRatio="xMidYMid meet" 
zoomAndPan="magnify" contentStyleType="text/css" height="200">
   <!--Generated by the Batik Graphics2D SVG Generator-->
   <defs id="genericDefs" />
   <g />
</svg>

I can't see the ellipse in this file!
I'm sure I made a mistake somewhere in this code that generates the file:

   public void createSVGSample(Dimension size)
   {
     SVGGraphics2D svgGenerator;
     Element ellipse;
     Element group;
     Element svgElement;

     CSSDocumentHandler.setParserClassName("org.apache.batik.css.parser.Parser");
     DOMImplementation impl = SVGDOMImplementation.getDOMImplementation();
     String namespaceURI = SVGDOMImplementation.SVG_NAMESPACE_URI;
     SVGDocument document = (SVGDocument)impl.createDocument(namespaceURI, 
"svg", null);

     // Asuming the first child has the SVG tag
     svgElement = (Element)document.getFirstChild();
     group = 
document.createElementNS(SVGConstants.SVG_NAMESPACE_URI,SVGConstants.SVG_G_TAG);
     ellipse = 
document.createElementNS(SVGConstants.SVG_NAMESPACE_URI,SVGConstants.SVG_ELLIPSE_TAG);
     ellipse.setAttributeNS(null, SVGConstants.SVG_WIDTH_ATTRIBUTE,"" + 3);
     ellipse.setAttributeNS(null, SVGConstants.SVG_RX_ATTRIBUTE ,"" + 10);
     ellipse.setAttributeNS(null, SVGConstants.SVG_RY_ATTRIBUTE ,"" + 20);
     svgElement.appendChild(group);
     group.appendChild(ellipse);

     try
     {
       svgGenerator = new SVGGraphics2D(document);
       svgGenerator.setSVGCanvasSize(size);
       svgGenerator.stream("test.svg",true);
     }
     catch(Exception e)
     {
     }
   }

Thanks for your help.

By the way, is there any archive for this mailing list?

Philippe

creating a SVG document programaticaly ?

Posted by Thomas E Deweese <th...@kodak.com>.
>>>>> "PC" == Philippe Converset <pc...@qarbon.com> writes:

PC> I'm completely new to Batik and I am trying to find a way to
PC> create from scratch a SVG document in my program in order to
PC> render it in a JSVGCanvas (think of it as if I was writing an
PC> authoring tool like Jasc WebDraw).  

    Sounds interesting...

PC> As far as I could understood all the impressive Batik packages, it
PC> seems that I need to create a SVGOMDocument and append a child on
PC> the root node.  Is there any sample of this operation? I'm sure
PC> it's not as simple as that!

    Well right now you have two choices for easily generating SVG
content from Java.  One is exactly what you list above, use the
standard set of DOM API calls to build an SVG DOM tree that represents
your content.  This might be as simple as adding one or two children
with a few simple attributes, or depending on the content, it may
involve constructing hundreds of elements some of which have
"non-trivial" attribute structures (I'm thinking of the path element
in particular here).  So this may be really easy for you or still
fairly hard.

    The other mechanism, would be to use the SVGGraphics2D.  This
would allow you to construct an SVG DOM tree by calling all the normal
methods on Java's Graphics2D.  I don't know what you exact situation
is so this may be easier or harder for you.  It might seem a little
strange to use the Graphics2D route when you want to display the
result in a JSVGCanvas, since the obvious question becomes: Why not
just put the code in the paint method of a AWT component?

    The answer is because you probably want some kind of persistence,
the user draws something which you translate into a bunch of
Graphics2D draw commands immediately and instead of having to be able
to "record" those drawing commands you can have the SVGGraphics2D
"record" them into an SVG DOM tree.  Which the JSVGCanvas can then
render for you, and you get the added bonus of a standard output
format.

    I might also point out that the what the way the JSVGCanvas works
it would be fairly simple to subclass it, so you can interactively
draw new content "on top of" the current SVG (just do your painting
after calling the baseclass paint method). Then only when the user
completes the drawing operation do you stick it in the DOM tree.
   
    Hope this is helpful...

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