Skip to content

SVG issue #350

@dilip29jan

Description

@dilip29jan

SVG layout is breaking.

am trying to print doughnut developed in SVG into PDF. below is my sample doughnut code:

<title>PDF</title>
<svg width="300" height="300" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" style="padding-left: 45%;padding-top: 5%;">
    <!-- Center color -->
    <circle cx="50" cy="50" r="40" fill="white"></circle>
    <!-- Default color of ring -->
    <circle cx="50" cy="50" r="40" stroke-width="20" stroke="white"></circle>

    <!-- Progress -->
    <!-- The amount shown as 'filled' is the amount the ring fills, starting from right center (3 o' clock) -->
    <!-- 100% fill -->
    <circle cx="50" cy="50" r="40" fill="white" stroke-width="20" stroke="#2196f3" stroke-dasharray="251.2" stroke-dashoffset="0"></circle>
    <!-- 80% fill -->
    <circle cx="50" cy="50" r="40" fill="white" stroke-width="20" stroke="#ff5722" stroke-dasharray="251.2" stroke-dashoffset="50.3"></circle>
    <!-- 70% filled -->
    <circle cx="50" cy="50" r="40" fill="white" stroke-width="20" stroke="#009688" stroke-dasharray="251.2" stroke-dashoffset="75.36"></circle>
    <!-- 50% filled -->
    <circle cx="50" cy="50" r="40" fill="white" stroke-width="20" stroke="#9c27b0" stroke-dasharray="251.2" stroke-dashoffset="125.6"></circle>
    <!-- 40% filled -->
    <circle cx="50" cy="50" r="40" fill="white" stroke-width="20" stroke="#e91e63" stroke-dasharray="251.2" stroke-dashoffset="150.72"></circle>
    <!-- 20% filled -->
    <circle cx="50" cy="50" r="40" fill="white" stroke-width="20" stroke="#f44336" stroke-dasharray="251.2" stroke-dashoffset="200.96"></circle>
    <!-- Center Text -->
    <text x="40" y="50" fill="black" font-size="10">TEST</text>
</svg>

in each circle I updated "fill from "transparent" to "white" to get the center of donut white in color, other wise it is rendering to black.

issue1: fill = transparent is not working as expected
issue2: one of the cycles (mostly the last one ) "stroke-width" is failing to pick up
issue3: there is change in size of svg in html and pdf

am using
compile group: 'com.openhtmltopdf', name: 'openhtmltopdf-pdfbox', version: '0.0.1-RC19'
compile group: 'com.openhtmltopdf', name: 'openhtmltopdf-svg-support', version: '0.0.1-RC19'

below is my sample code:

PdfRendererBuilder builder = new PdfRendererBuilder();

        builder.withUri("test.html");
        builder.useFastMode();
        builder.toStream(os);
        builder.useSVGDrawer(new BatikSVGDrawer()); // Load SVG support plugin
        builder.run();

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions