Batik: Inhalt JComponent to SVG?

[blz]

Hallo,
ich finde zwar viel Content im Web, aber letztlich nicht die Antwort auf meine Frage:
Wie kann ich möglichst einfach den Inhalt einer JComponent als SVG file speichern?
Ich möchte einerseits in die JComponent hineinzeichnen und die Zeichnung im Programm angezegit bekommen, und andererseits über einen Speichern-Button das Ganze als SVG speichern können.
Ich habe es hinbekommen, wenn ich bei jedem Zeichenvorgang einerseits auf das Graphics-Objekt male und andererseits dasselbe nochmal auf das SVGGraphics-Objekt von Batik zeichne.
Aber es muss doch auch einfacher möglich sein, nämlich so, dass ich beliebig viel in Java zeichne und dann, wenn ich speichern drücke, der gesamte Inhalt der Komponente als SVG gespeichert wird?!

 

[Robert Zenz]

Ohne jetzt zu wissen was genau du da machst, aber ich denke dass Problem das du hierbei uebersiehst ist der Unterschied zwischen Pixel- und Vektor-Grafiken. Wenn du jetzt in deiner JComponent zeichnest, malst du "nur" Pixel an, fuer ein SVG musst du das alles aber als (quasi) Vektoren haben. Damit gibt es hier nur zwei Moeglichkeiten:

1. Du ueberlegst dir eine Umwandlung von der JComponent auf Vektor-Grafik.
2. Du malst beides gleichzeitig.

So oder so, wird es gefuehlt Unterschiede zwischen beiden geben, weil das nicht eins-zu-eins uebersetzbar ist, nicht direkt zumindest.

Ich meine, wenn alles versagt kannst du eine Bitmap im SVG einbetten, aber das ist irgendwie Sinnfrei.

Was ist denn dein genauer Anwendungsfall? Was wird da gezeichnet dass du es dann als SVG brauchst?

 

[Oneixee5]

Es gibt die Klassen
org.apache.batik.svggen.SVGGraphics2D;
org.apache.batik.swing.JSVGCanvas;
Damit kannst du direkt ein SVG-XML-Doc wie ein normales java.awt.Canvas verwenden. Den XML-DOM behältst du einfach im Speicher, wenn nötig speicherst du dann einfach als SVG.
Ich hebe mal, auf die Schnelle ein hässliches 10-Minuten-Beispiel gemacht. Also nicht kopieren, es geht nur ums Prinzip:

package swing;

import java.awt.Canvas;
import java.awt.Color;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.Insets;
import java.awt.Rectangle;
import java.awt.Shape;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.geom.Ellipse2D;
import java.io.FileWriter;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.WindowConstants;

import org.apache.batik.anim.dom.SVGDOMImplementation;
import org.apache.batik.svggen.SVGGraphics2D;
import org.apache.batik.swing.JSVGCanvas;
import org.w3c.dom.DOMImplementation;
import org.w3c.dom.Element;
import org.w3c.dom.svg.SVGDocument;

public class SvgPaint extends JFrame {

    private final List<Rectangle> rectangles = new ArrayList<>();

    private JSVGCanvas canvas = null;

    public SvgPaint() {
        this.canvas = new JSVGCanvas();
        setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
        final GridBagLayout layout = new GridBagLayout();
        getContentPane().setLayout(layout);
        final JButton buttonSave = new JButton("Speichern");
        buttonSave.addActionListener(e -> drawPoints(false));

        final GridBagConstraints gridBagConstraintsButton = new GridBagConstraints(0, 0, 1, 1, 0.0, 0.0,
                GridBagConstraints.CENTER, GridBagConstraints.NONE, new Insets(0, 0, 0, 0), 0, 0);
        getContentPane().add(buttonSave, gridBagConstraintsButton);

        final GridBagConstraints gridBagConstraintsSVG = new GridBagConstraints(0, 1, 1, 1, 1.0, 1.0,
                GridBagConstraints.CENTER, GridBagConstraints.BOTH, new Insets(0, 0, 0, 0), 0, 0);
        getContentPane().add(this.canvas, gridBagConstraintsSVG);

        this.canvas.addMouseListener(new MouseAdapter() {

            private int startX = -1;
            private int startY = -1;

            @Override
            public void mousePressed(MouseEvent e) {
                this.startX = e.getX();
                this.startY = e.getY();
            }

            @Override
            public void mouseReleased(MouseEvent e) {
                int intX = e.getX();
                int intY = e.getY();
                int intWidth = intX - this.startX;
                if (intX < this.startX) {
                    intWidth = -1 * intWidth;
                    final int intTemp = intX;
                    intX = this.startX;
                    this.startX = intTemp;
                }
                int intHeight = intY - this.startY;
                if (intY < this.startY) {
                    intHeight = -1 * intHeight;
                    final int intTemp = intY;
                    intY = this.startY;
                    this.startY = intTemp;
                }

                final Rectangle rect = new Rectangle(this.startX, this.startY,
                        intWidth, intHeight);
                SvgPaint.this.rectangles.add(rect);

                drawPoints(true);
            }
        });

    }

    private void drawPoints(boolean drawOrSave) {

        final DOMImplementation impl = SVGDOMImplementation.getDOMImplementation();
        final String svgNS = SVGDOMImplementation.SVG_NAMESPACE_URI;
        final SVGDocument doc = (SVGDocument) impl.createDocument(svgNS, "svg", null);
        final SVGGraphics2D g = new SVGGraphics2D(doc);

        for (final Rectangle rectCurrent : this.rectangles) {
            final Shape circle =
                    new Ellipse2D.Double(rectCurrent.x, rectCurrent.y, rectCurrent.width, rectCurrent.height);
            g.setPaint(Color.red);
            g.draw(circle);
        }

        if (drawOrSave == true) {
            final Element root = doc.getDocumentElement();
            g.getRoot(root);
            this.canvas.setSVGDocument(doc);
        } else {
            try (FileWriter fileWriter = new FileWriter("test.svg")) {
                g.stream(fileWriter, false);
            } catch (final IOException e) {
                e.printStackTrace();
            }
        }
    }

    public static void main(String[] args) {
        final SvgPaint form = new SvgPaint();
        form.pack();
        form.setVisible(true);
    }

}

 

[blz]

Vielen Dank, das ist sehr nett und glaube ich auch genau das, was ich brauche.
Ich spezifiziere noch einmal meine Anforderungen:
Ich habe ein Programm zum Zeichnen von Diagrammen geschrieben. Ich habe ein JLayeredPane, das mehrere durchsichtige JPanels enthält, die sich z. T. auch überlappen. Auf den einzelnen JPanels zeichne ich Rechtecke, Linien und habe JTextareas.
Bisher habe ich das alles unter Swing als Pixelgrafik gezeichnet und mir eine eigene Zoomroutine geschrieben, da mir der Gedanke, dass ich das auch als Vektorgrafik speichern könnte, erst gar nicht gekommen ist.

Nun, da er mir gekommen ist, war mein erster Gedanke, vllt. gibt es ja eine Methode, die all die Inhalte automatisch in eine Vektorgrafik transcodiert. Quasi so, dass ich beim Speichern-Button nur schreiben muss: Speichere die Inahlte der Kinder des JLayeredPane alle als SVG. fertig.
Aber das scheint es ja nicht zu geben.

Alle Inhalte parallel in Pixel- und Vektorgrafik zu malen wäre machbar. Da aber meine eigene Zoomroutine nicht ganz perfekt ist, favorisiere ich nun den Gedanken, alles von vornherein als Vektorgrafik zu erstellen. Dann gibt es vermutlich eine native Zoomfunktion, die man nutzen kann.

Ich fasse die Erklärungen von Oneixee5 noch mal in eigenen Worten zusammen, um sicherzugehen, dass ich das richtig verstanden habe:
Mit "ein SVG-XML-Doc wie ein normales java.awt.Canvas verwenden" meinst du, ich zeichne letztlich vom Vorgehen her genauso wie in Swing auf mein JPanel, allerdings wird keine Pixelgrafik erstellt, sondern eben eine Vektorgrafik, ein SVG-XML-Document. Wenn ich dann speichern will, habe ich Zugriff auf die XML-Dokumentenstruktur und kann ganz einfach als XML speichern (und vermutlich auch als Pixelgrafik exportieren.)

Das Beispiel bringe ich leider nicht zum Laufen, da der letzte Import nicht funktioniert:
The import org.w3c.dom.svg.SVGDocument cannot be resolved
Ich nehme an, es ist ein Versionenproblem?! Bisher konnte ich es nicht lösen...

 

[Oneixee5]

Wie gesagt, das ist nur so auf die Schnelle zusammengeschustert, das geht bestimmt noch sauberer - die Abhängigkeiten:

<dependency>
    <groupId>org.apache.xmlgraphics</groupId>
    <artifactId>batik-swing</artifactId>
    <version>1.14</version>
    <exclusions>
        <exclusion>
            <artifactId>xml-apis</artifactId>
            <groupId>xml-apis</groupId>
        </exclusion>
    </exclusions>
</dependency>
<dependency>
    <groupId>org.apache.xmlgraphics</groupId>
    <artifactId>batik-svggen</artifactId>
    <version>1.14</version>
    <exclusions>
        <exclusion>
            <artifactId>xml-apis</artifactId>
            <groupId>xml-apis</groupId>
        </exclusion>
    </exclusions>
</dependency>
<dependency>
    <groupId>org.apache.xmlgraphics</groupId>
    <artifactId>batik-util</artifactId>
    <version>1.14</version>
</dependency>
<dependency>
    <groupId>org.apache.xmlgraphics</groupId>
    <artifactId>batik-constants</artifactId>
    <version>1.14</version>
</dependency>

 

[Oneixee5]

Ich fasse die Erklärungen von Oneixee5 noch mal in eigenen Worten zusammen, um sicherzugehen, dass ich das richtig verstanden habe:
Mit "ein SVG-XML-Doc wie ein normales java.awt.Canvas verwenden" meinst du, ich zeichne letztlich vom Vorgehen her genauso wie in Swing auf mein JPanel, allerdings wird keine Pixelgrafik erstellt, sondern eben eine Vektorgrafik, ein SVG-XML-Document. Wenn ich dann speichern will, habe ich Zugriff auf die XML-Dokumentenstruktur und kann ganz einfach als XML speichern (und vermutlich auch als Pixelgrafik exportieren.)

Nein, s. Beispiel:

        final SVGDocument doc = (SVGDocument) impl.createDocument(svgNS, "svg", null);
        final SVGGraphics2D g = new SVGGraphics2D(doc);

        for (final Rectangle rectCurrent : this.rectangles) {
            final Shape circle =
                    new Ellipse2D.Double(rectCurrent.x, rectCurrent.y, rectCurrent.width, rectCurrent.height);
            g.setPaint(Color.red);
            g.draw(circle);
        }

Du zeichnest deine Vektoren in das SVG/XML und SVGGraphics2D/JSVGCanvas übernimmt das Darstellen. SVG ist keine Pixelgrafik!

final Element root = doc.getDocumentElement();
g.getRoot(root);
this.canvas.setSVGDocument(doc);

Eine Zoomfunktion ist quasi überflüssig, da es sich um eine Vektorgrafik handelt. Es ist für SVG sozusagen eine Grundfunktion, verlustfrei zoombar zu sein.

 

[Oneixee5]

class​	JSVGCanvas.ZoomAction A swing action to apply a zoom factor to the canvas.
class​	JSVGCanvas.ZoomInAction A swing action to zoom in the canvas.
class​	JSVGCanvas.ZoomOutAction A swing action to zoom out the canvas.