JSVG

You can modify SVG elements (e.g., changing colors or attributes) before they are fully parsed by using a DomProcessor via the LoaderContext.

To implement this:

1. Implement the DomProcessor interface and override the process(DomElement root) method.
2. Inside process, use element.attribute(name, default) to read attributes and element.setAttribute(name, value) to modify them.
3. To inject custom dynamic values (like a color that changes at runtime), use document.registerNamedElement(id, paint) and then set the element's attribute to that id.
4. Pass the processor to the loader using LoaderContext.builder().preProcessor(processor).build().

// 1. Define a processor
CustomColorsProcessor processor = new CustomColorsProcessor(List.of("myRect"));

// 2. Load with the processor
SVGLoader loader = new SVGLoader();
SVGDocument document = loader.load(svgUrl, LoaderContext.builder().preProcessor(processor).build());

// 3. Update the dynamic value later
DynamicAWTSvgPaint dynamicColor = processor.customColorForId("myRect");
dynamicColor.setColor(Color.RED);
// Then call repaint() on your component

The JavaFX renderer is experimental and requires the com.github.weisj:jsvg-javafx dependency (for JavaFX 17+).

Use the FXSVGCanvas control, which is a standard JavaFX Control. You can choose between two rendering backends:

• RenderBackend.JavaFX: Faster, hardware-accelerated, but may have issues with advanced features like filters and masks.
• RenderBackend.AWT: Uses the JSVG AWT pipeline; slower but more accurate.

FXSVGCanvas supports JavaFX properties for easy binding and provides methods to control animation playback.

// Required dependency: com.github.weisj:jsvg-javafx:2.0.1

SVGLoader loader = new SVGLoader();
SVGDocument document = loader.load(getClass().getResource("path/to/image.svg"));

FXSVGCanvas canvas = new FXSVGCanvas();
canvas.setRenderBackend(FXSVGCanvas.RenderBackend.JavaFX);
canvas.setDocument(document);

// Control playback
canvas.pauseAnimation();
canvas.playAnimation();
canvas.restartAnimation();

// Configuration
canvas.setShowTransparentPattern(true);
canvas.setViewBox(new ViewBox(0, 0, 200, 200));

To render an SVG in a Swing application, use SVGLoader to load an SVGDocument and then call document.render() within a component's paintComponent method. It is recommended to set RenderingHints.KEY_ANTIALIASING and RenderingHints.KEY_STROKE_CONTROL for better visual quality.

Key steps:

1. Instantiate SVGLoader.
2. Load the document using loader.load(URL).
3. Create a custom JPanel (or JComponent) that overrides paintComponent.
4. Inside paintComponent, call document.render(this, graphics2D, viewBox) where viewBox defines the visible area.

SVGLoader loader = new SVGLoader();
URL svgUrl = RenderExample.class.getResource("path/to/image.svg");
SVGDocument document = loader.load(Objects.requireNonNull(svgUrl, "SVG file not found"));

// Inside a JPanel's paintComponent(Graphics g):
Graphics2D g2d = (Graphics2D) g;
g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2d.setRenderingHint(RenderingHints.KEY_STROKE_CONTROL, RenderingHints.VALUE_STROKE_PURE);
document.render(this, g2d, new ViewBox(0, 0, getWidth(), getHeight()));

For Swing applications, use the AnimationPlayer helper class to drive SVG animations.

1. Create an AnimationPlayer passing a repaint callback: new AnimationPlayer(e -> repaint()).
2. Set the animation state: player.setAnimation(document.animation()).
3. In paintComponent, use document.renderWithPlatform instead of document.render. You must provide an AwtComponentPlatformSupport instance and the player.animationState().

public class AnimationPanel extends JComponent {
    private final @NotNull SVGDocument document;
    private final @NotNull AnimationPlayer player;

    public AnimationPanel(@NotNull SVGDocument document) {
        this.document = document;
        this.player = new AnimationPlayer(e -> repaint());
        player.setAnimation(document.animation());
    }

    @Override
    protected void paintComponent(Graphics g) {
        super.paintComponent(g);
        // ... set rendering hints ...
        document.renderWithPlatform(
            new AwtComponentPlatformSupport(this),
            Output.createForGraphics((Graphics2D) g),
            new ViewBox(0, 0, getWidth(), getHeight()),
            player.animationState());
    }

    public void startAnimation() { player.start(); }
    public void stopAnimation() { player.stop(); }
}

JSVG provides varying levels of support for SVG elements. When choosing elements for your SVG files, refer to the following status indicators to understand expected behavior:

• ✅ Supported: The element is fully implemented (though not all attributes may be supported).
• ✅* Supported (Limited): The element is supported, but certain features (like querying content for <desc>) may not work.
• ☑️ Partially Implemented: The element is implemented but may lack basic features.
• ❌ Not Supported: The element is currently not implemented.
• ⚠️ Deprecated: The element is deprecated in the SVG specification and has low implementation priority.
• 🧪 Experimental: Part of the SVG 2.* spec; behavior may not be fully predictable.

| Element       | Status              |
|---------------|---------------------|
| a             | :white_check_mark:  |
| circle        | :white_check_mark:  |
| clipPath      | :white_check_mark:  |
| defs          | :white_check_mark:  |
| ellipse       | :white_check_mark:  |
| foreignObject | :x:                 |
| g             | :white_check_mark:  |
| image         | :white_check_mark:  |
| line          | :white_check_mark:  |
| marker        | :white_check_mark:  |
| mask          | :white_check_mark:  |
| path          | :white_check_mark:  |
| polygon       | :white_check_mark:  |
| polyline      | :white_check_mark:  |
| rect          | :white_check_mark:  |
| svg           | :white_check_mark:  |
| symbol        | :white_check_mark:  |
| use           | :white_check_mark:  |
| view          | :white_check_mark:* |