使用蜡染将SVG DOM结构另存为SVG文件

Question

I dynamically create and modify a SVG DOM structure using batik in Java. I can show the created structure on a JSVGCanvas . When the process is finished, I want to export this DOM structure and save it as a SVG file.

To create the DOM I used something like this:

DOMImplementation impl = SVGDOMImplementation.getDOMImplementation();
String svgNS = SVGDOMImplementation.SVG_NAMESPACE_URI;
SVGDocument doc = (SVGDocument) impl.createDocument(svgNS, "svg", null);
Element svgRoot = doc.getDocumentElement();
svgRoot.setAttributeNS(null, "width", "300");
svgRoot.setAttributeNS(null, "height", "300");

I can add stuff to this document and present it on the JSVGCanvas using something like the following code:

Element rect = doc.createElementNS(signs, "rect");
rect.setAttributeNS(null, "x", "20");
rect.setAttributeNS(null, "y", "50");
rect.setAttributeNS(null, "width", "140");
rect.setAttributeNS(null, "height", "210");
rect.setAttributeNS(svgNS, "fill", "grey");
rect.setAttributeNS(svgNS, "stroke", "black");
svgRoot.appendChild(rect);

JSVGCanvas canvas = new JSVGCanvas();
canvas.setDocumentState(ALWAYS_DYNAMIC);
canvas.setDocument(doc);

The code shows the document on the JSVGCanvas .

My last step is trying to save the document as a SVG file. I read many threads online using SVGGraphics2D and drawing in there. The file can then be exported using a Writer .

SVGGraphics2D graphics = new SVGGraphics2D(doc);


// Finally, stream out SVG to the standard output using UTF-8
// character to byte encoding
boolean useCSS = true; // we want to use CSS style attribute
Writer out;
try {
    out = new OutputStreamWriter(new FileOutputStream(path), "UTF-8");
graphics.stream(out, useCSS);
out.flush();
out.close();
} catch (UnsupportedEncodingException | FileNotFoundException e) {
    e.printStackTrace();
} catch (SVGGraphics2DIOException e) {
    e.printStackTrace();
} catch (IOException e) {
    e.printStackTrace();
}

The written file is missing my modified DOM structure and looks like the following code:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.0//EN'
'http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd'>

<svg style="stroke-dasharray:none; shape-rendering:auto; font-family:'Dialog'; text-rendering:auto; fill-opacity:1; color-interpolation:auto; color-rendering:auto; font-size:12px; 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" 
contentScriptType="text/ecmascript" preserveAspectRatio="xMidYMid meet" 
xmlns:xlink="http://www.w3.org/1999/xlink" zoomAndPan="magnify" version="1.0" contentStyleType="text/css">
<!--Generated by the Batik Graphics2D SVG Generator-->
<defs id="genericDefs"/><g/></svg>

Is there a way how I can make the SVGGraphics2D use my modified svgRoot or doc . Or is there an other way how to save the document shown on the JSVGCanvas .

Answer 1

You could try and save the document as plain xml since svg is basically xml.

// you will need these imports.
import javax.xml.transform.Result;
import javax.xml.transform.Source;
import javax.xml.transform.Transformer;
import javax.xml.transform.TransformerException;
import javax.xml.transform.TransformerFactory;
import javax.xml.transform.TransformerFactoryConfigurationError;
import javax.xml.transform.dom.DOMSource;
import javax.xml.transform.stream.StreamResult;

// these 4 lines take your document doc and save it as output.svg
Transformer transformer = TransformerFactory.newInstance().newTransformer();
Result output = new StreamResult(new File("C:\\output.svg"));
Source input = new DOMSource(doc);
transformer.transform(input, output);

There is a chance you will get strange error: java.lang.NoClassDefFoundError: org/apache/xml/serializer/TreeWalker Solution to that is to set a system property before you try to create instance of Transformer, like this

System.setProperty("javax.xml.transform.TransformerFactory", "com.sun.org.apache.xalan.internal.xsltc.trax.TransformerFactoryImpl");

Answer 2

According to this source instead of

try {
    out = new OutputStreamWriter(new FileOutputStream(path), "UTF-8");
    graphics.stream(out, useCSS);
}

Try to export whole document:

try (Writer out = new OutputStreamWriter(new FileOutputStream(path), "UTF-8")) {
    graphics.stream(doc.getDocumentElement(), out, useCSS, false);
}

Be sure that your rectangle ( Element rect ) already added to root svg document ( SVGDocument doc )