Kozea / pygal

PYthon svg GrAph plotting Library
https://www.pygal.org
GNU Lesser General Public License v3.0
2.64k stars 411 forks source link

invalid stylesheet in svg #554

Closed kauswagan-io closed 9 months ago

kauswagan-io commented 10 months ago

I owuld like to place a svg in a pdf using fpdf2 but it results in a black box. Since i can not install all dependencies for cairo I thus try to convert the svg to a png using apache batik. However this also fails with a pointer to an invalid stylesheet:

`org.w3c.dom.DOMException: file:/opt/splunk/etc/apps/betterpdf/bin/tmpchart.svg: The following stylesheet represents an invalid CSS document.

chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f{-webkit-user-select:none;-webkit-font-smoothing:antialiased;font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .title{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:16px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .legends .legend text{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:14px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis text{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:10px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis text.major{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:10px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay text.value{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:16px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay text.label{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:10px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:14px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f text.no_data{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:64px}

chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f{background-color:rgba(249,249,249,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f path,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f rect,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f circle{-webkit-transition:150ms;-moz-transition:150ms;transition:150ms}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .graph > .background{fill:rgba(249,249,249,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .plot > .background{fill:rgba(255,255,255,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .graph{fill:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f text.no_data{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .title{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .legends .legend text{fill:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .legends .legend:hover text{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .line{stroke:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .guide.line{stroke:rgba(0,0,0,.54)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .major.line{stroke:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis text.major{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .line-graph .axis.x .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .stackedline-graph .axis.x .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .xy-graph .axis.x .guides:hover .guide.line{stroke:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .guides:hover text{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .reactive{fill-opacity:.7;stroke-opacity:.8;stroke-width:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .ci{stroke:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .reactive.active,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .active .reactive{fill-opacity:.8;stroke-opacity:.9;stroke-width:4}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .ci .reactive.active{stroke-width:1.5}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .series text{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip rect{fill:rgba(255,255,255,1);stroke:rgba(0,0,0,1);-webkit-transition:opacity 150ms;-moz-transition:opacity 150ms;transition:opacity 150ms}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .label{fill:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .label{fill:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .legend{font-size:.8em;fill:rgba(0,0,0,.54)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .x_label{font-size:.6em;fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .xlink{font-size:.5em;text-decoration:underline}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .value{font-size:1.5em}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .bound{font-size:.5em}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .max-value{font-size:.75em;fill:rgba(0,0,0,.54)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .map-element{fill:rgba(255,255,255,1);stroke:rgba(0,0,0,.54) !important}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .map-element .reactive{fill-opacity:inherit;stroke-opacity:inherit}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-0,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-0 a:visited{stroke:#F44336;fill:#F44336}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-1,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-1 a:visited{stroke:#3F51B5;fill:#3F51B5}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-2,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-2 a:visited{stroke:#009688;fill:#009688}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-3,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-3 a:visited{stroke:#FFC107;fill:#FFC107}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-4,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-4 a:visited{stroke:#FF5722;fill:#FF5722}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-0 text{fill:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-1 text{fill:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-2 text{fill:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-3 text{fill:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-4 text{fill:black}

chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f text.no_data{text-anchor:middle}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .guide.line{fill:none}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .centered{text-anchor:middle}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .title{text-anchor:middle}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .legends .legend text{fill-opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.x text{text-anchor:middle}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.x:not(.web) text[transform]{text-anchor:start}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.x:not(.web) text[transform].backwards{text-anchor:end}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y text{text-anchor:end}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y text[transform].backwards{text-anchor:start}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y2 text{text-anchor:start}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y2 text[transform].backwards{text-anchor:end}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .guide.line{stroke-dasharray:4,4;stroke:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .major.guide.line{stroke-dasharray:6,6;stroke:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .horizontal .axis.y .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .horizontal .axis.y2 .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .vertical .axis.x .guide.line{opacity:0}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .horizontal .axis.always_show .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .vertical .axis.always_show .guide.line{opacity:1 !important}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y2 .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.x .guides:hover .guide.line{opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .guides:hover text{opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .nofill{fill:none}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .subtle-fill{fill-opacity:.2}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .dot{stroke-width:1px;fill-opacity:1;stroke-opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .dot.active{stroke-width:5px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .dot.negative{fill:transparent}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f text,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f tspan{stroke:none !important}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .series text.active{opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip rect{fill-opacity:.95;stroke-width:.5}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip text{fill-opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .showable{visibility:hidden}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .showable.shown{visibility:visible}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .gauge-background{fill:rgba(229,229,229,1);stroke:none}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .bg-lines{stroke:rgba(249,249,249,1);stroke-width:2px}

Original message: The "fill" property does not support function values. at org.apache.batik.css.engine.CSSEngine.parseStyleSheet(CSSEngine.java:1226) at org.apache.batik.css.engine.CSSEngine.parseStyleSheet(CSSEngine.java:1204) at org.apache.batik.anim.dom.SVGOMStyleElement.getCSSStyleSheet(SVGOMStyleElement.java:140) at org.apache.batik.css.engine.CSSEngine.getStyleSheetNodes(CSSEngine.java:923) at org.apache.batik.css.engine.CSSEngine.getCascadedStyleMap(CSSEngine.java:785) at org.apache.batik.css.engine.CSSEngine.getComputedStyle(CSSEngine.java:867) at org.apache.batik.bridge.CSSUtilities.getComputedStyle(CSSUtilities.java:81) at org.apache.batik.bridge.CSSUtilities.convertVisibility(CSSUtilities.java:578) at org.apache.batik.bridge.SVGSVGElementBridge.createGraphicsNode(SVGSVGElementBridge.java:141) at org.apache.batik.bridge.GVTBuilder.build(GVTBuilder.java:76) at org.apache.batik.transcoder.SVGAbstractTranscoder.transcode(SVGAbstractTranscoder.java:210) at org.apache.batik.transcoder.image.ImageTranscoder.transcode(ImageTranscoder.java:92) at org.apache.batik.transcoder.XMLAbstractTranscoder.transcode(XMLAbstractTranscoder.java:142) at org.apache.batik.transcoder.SVGAbstractTranscoder.transcode(SVGAbstractTranscoder.java:158) at org.apache.batik.apps.rasterizer.SVGConverter.transcode(SVGConverter.java:1008) at org.apache.batik.apps.rasterizer.SVGConverter.execute(SVGConverter.java:719) at org.apache.batik.apps.rasterizer.Main.execute(Main.java:956) at org.apache.batik.apps.rasterizer.Main.main(Main.java:1009) ERROR: null Enclosed Exception: file:/opt/splunk/etc/apps/betterpdf/bin/tmpchart.svg: The following stylesheet represents an invalid CSS document.

chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f{-webkit-user-select:none;-webkit-font-smoothing:antialiased;font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .title{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:16px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .legends .legend text{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:14px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis text{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:10px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis text.major{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:10px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay text.value{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:16px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay text.label{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:10px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:14px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f text.no_data{font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:64px}

chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f{background-color:rgba(249,249,249,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f path,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f rect,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f circle{-webkit-transition:150ms;-moz-transition:150ms;transition:150ms}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .graph > .background{fill:rgba(249,249,249,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .plot > .background{fill:rgba(255,255,255,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .graph{fill:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f text.no_data{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .title{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .legends .legend text{fill:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .legends .legend:hover text{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .line{stroke:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .guide.line{stroke:rgba(0,0,0,.54)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .major.line{stroke:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis text.major{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .line-graph .axis.x .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .stackedline-graph .axis.x .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .xy-graph .axis.x .guides:hover .guide.line{stroke:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .guides:hover text{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .reactive{fill-opacity:.7;stroke-opacity:.8;stroke-width:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .ci{stroke:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .reactive.active,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .active .reactive{fill-opacity:.8;stroke-opacity:.9;stroke-width:4}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .ci .reactive.active{stroke-width:1.5}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .series text{fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip rect{fill:rgba(255,255,255,1);stroke:rgba(0,0,0,1);-webkit-transition:opacity 150ms;-moz-transition:opacity 150ms;transition:opacity 150ms}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .label{fill:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .label{fill:rgba(0,0,0,.87)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .legend{font-size:.8em;fill:rgba(0,0,0,.54)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .x_label{font-size:.6em;fill:rgba(0,0,0,1)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .xlink{font-size:.5em;text-decoration:underline}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip .value{font-size:1.5em}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .bound{font-size:.5em}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .max-value{font-size:.75em;fill:rgba(0,0,0,.54)}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .map-element{fill:rgba(255,255,255,1);stroke:rgba(0,0,0,.54) !important}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .map-element .reactive{fill-opacity:inherit;stroke-opacity:inherit}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-0,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-0 a:visited{stroke:#F44336;fill:#F44336}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-1,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-1 a:visited{stroke:#3F51B5;fill:#3F51B5}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-2,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-2 a:visited{stroke:#009688;fill:#009688}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-3,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-3 a:visited{stroke:#FFC107;fill:#FFC107}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-4,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .color-4 a:visited{stroke:#FF5722;fill:#FF5722}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-0 text{fill:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-1 text{fill:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-2 text{fill:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-3 text{fill:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .text-overlay .color-4 text{fill:black}

chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f text.no_data{text-anchor:middle}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .guide.line{fill:none}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .centered{text-anchor:middle}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .title{text-anchor:middle}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .legends .legend text{fill-opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.x text{text-anchor:middle}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.x:not(.web) text[transform]{text-anchor:start}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.x:not(.web) text[transform].backwards{text-anchor:end}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y text{text-anchor:end}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y text[transform].backwards{text-anchor:start}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y2 text{text-anchor:start}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y2 text[transform].backwards{text-anchor:end}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .guide.line{stroke-dasharray:4,4;stroke:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .major.guide.line{stroke-dasharray:6,6;stroke:black}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .horizontal .axis.y .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .horizontal .axis.y2 .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .vertical .axis.x .guide.line{opacity:0}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .horizontal .axis.always_show .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .vertical .axis.always_show .guide.line{opacity:1 !important}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.y2 .guides:hover .guide.line,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis.x .guides:hover .guide.line{opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .axis .guides:hover text{opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .nofill{fill:none}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .subtle-fill{fill-opacity:.2}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .dot{stroke-width:1px;fill-opacity:1;stroke-opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .dot.active{stroke-width:5px}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .dot.negative{fill:transparent}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f text,#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f tspan{stroke:none !important}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .series text.active{opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip rect{fill-opacity:.95;stroke-width:.5}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .tooltip text{fill-opacity:1}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .showable{visibility:hidden}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .showable.shown{visibility:visible}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .gauge-background{fill:rgba(229,229,229,1);stroke:none}#chart-ef007b8f-1fb7-4cce-8f6a-dbe96a04e65f .bg-lines{stroke:rgba(249,249,249,1);stroke-width:2px}

Original message: The "fill" property does not support function values.`

kauswagan-io commented 10 months ago

Jigsaw only really complains about this:

Parse Error graph >
Parse Error plot >

Modifying it satisfies jigsaw but batik keeps failing. cairosvg svg2svg method manages to convert the svg into one that batik is able to rasterize but i can not use the dependencies.

kauswagan-io commented 9 months ago

never mind, i just use casperjs to rende the svg to a png - bit overkill but works.

kauswagan-io commented 9 months ago

casperjs for rendering to png as a workaround