jgraph / svg2xml Goto Github PK

Seems like it's not possible to change fill color of an imported SVG (using svg2xml), only it's border color.

https://gyazo.com/ea850d6924cabcb4452b4f7d504b6d66

Any tips on how I can change it's fill color?

Terminal sits at "parsing Blog using 0 configs" even though I have some things checked.

add support for styles declared via stx like for AWS svgs (style classes)
transformation nesting
add support for manual setting of bounds (a rect with a custom ID)
handle multiple close paths (use only one)

A dialog informing the user that the conversion is successfully completed. It also displays the destination path.

The following example results in the error below. This example errors on input string "L", but I have additional examples the error on input string "q".

SVG Input File

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 777.14 754.49">
  <defs>
    <style>.cls-1{fill:#ef5024;}</style>
  </defs>
  <title>IP Address</title>
  <g id="Layer_2" data-name="Layer 2">
    <g id="Miscellaneous">
      <g id="IP_Address" data-name="IP Address">
        <path class="cls-1" d="M672.55,754.49H104.66C47.07,754.49.11,707.55,0,649.88L.09,104.66A104.77,104.77,0,0,1,104.71,0L672.55,0h.1A104.61,104.61,0,0,1,777.14,104.66V328.22a21.37,21.37,0,1,1-42.73,0V104.66a61.83,61.83,0,0,0-61.78-61.89h-.07l-567.85,0a62,62,0,0,0-61.88,61.92l-.09,545.17a62.09,62.09,0,0,0,61.92,61.93H672.55a61.85,61.85,0,0,0,61.86-61.91V479.4a21.37,21.37,0,1,1,42.73,0V649.83A104.58,104.58,0,0,1,672.55,754.49Z"/>
        <path class="cls-1" d="M294.84,450.7V269.09h38.51V450.7Z"/>
        <path class="cls-1" d="M513.43,325.73q0,29.32-18.32,44.85T443,386.11H426.48V450.7H388V269.09h58q33,0,50.25,14.22T513.43,325.73Zm-86.95,28.82h12.67q17.76,0,26.58-7t8.82-20.44q0-13.55-7.39-20T444,300.64H426.48Z"/>
      </g>
    </g>
  </g>
</svg>

Error Message
java.lang.NumberFormatException: For input string: "L"
at sun.misc.FloatingDecimal.readJavaFormatString(FloatingDecimal.java:2043)
at sun.misc.FloatingDecimal.parseDouble(FloatingDecimal.java:110)
at java.lang.Double.parseDouble(Double.java:538)
at java.lang.Double.valueOf(Double.java:502)
at com.mxgraph.svg2xml.Shape2Xml.getPathParam(Shape2Xml.java:1564)
at com.mxgraph.svg2xml.mxPathParser.curvetoQuadraticSmoothAbs(mxPathParser.java:423)
at com.mxgraph.svg2xml.mxPathParser.createShape(mxPathParser.java:154)
at com.mxgraph.svg2xml.Shape2Xml.parse(Shape2Xml.java:354)
at com.mxgraph.svg2xml.Svg2Xml.(Svg2Xml.java:510)
at com.mxgraph.svg2xml.Svg2XmlGui.actionPerformed(Svg2XmlGui.java:253)

Original post:
https://groups.google.com/g/drawio/c/J84VkEIxIFQ

Asked in google group here: https://groups.google.com/g/drawio/c/iwRh9zaH3A4
Any suggestion on cause and fix or workaround for this exception running sv2xml tool on this svg with default options:

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 32 32"><defs><style>.cls-1{fill:#fff;}.cls-2{fill:url(#linear-gradient);}.cls-3{mask:url(#mask);}.cls-4{fill:#161616;}</style><linearGradient id="linear-gradient" x1="2273.534" y1="-956.061" x2="2273.534" y2="-976.061" gradientTransform="matrix(1, 0, 0, -0.99, -2257.534, -940.352)" gradientUnits="userSpaceOnUse"><stop offset="0.05"/><stop offset="0.6" stop-opacity="0"/></linearGradient><mask id="mask" x="0" y="0" width="32" height="32" maskUnits="userSpaceOnUse"><path class="cls-1" d="M23.707,22.293,10,8.586V2H2v8H8.586L22.293,23.707ZM8,8H4V4H8Z"/><rect class="cls-2" x="11" y="6.101" width="10" height="19.799" transform="translate(38.627 16) rotate(135)"/><path class="cls-1" d="M30,30H22V22h8Zm-6-2h4V24H24Z"/></mask></defs><g id="Layer_2" data-name="Layer 2"><g id="Build_icon_here" data-name="Build icon here"><g class="cls-3"><rect class="cls-4" width="32" height="32"/></g><path class="cls-4" d="M7,22.142V13H5v9.142A3.992,3.992,0,1,0,9.858,27H19V25H9.858A4,4,0,0,0,7,22.142ZM6,28a2,2,0,1,1,2-2A2,2,0,0,1,6,28Z"/><path class="cls-4" d="M30,6a3.992,3.992,0,0,0-7.858-1H13V7h9.142A4,4,0,0,0,25,9.858V19h2V9.858A4,4,0,0,0,30,6ZM26,8a2,2,0,1,1,2-2A2,2,0,0,1,26,8Z"/></g></g></svg>

Exception in thread "AWT-EventQueue-0" java.lang.StringIndexOutOfBoundsException: String index out of range: 0

at java.lang.String.charAt(String.java:658)

at com.mxgraph.svg2xml.Svg2Xml.getAvgGradientColor(Svg2Xml.java:1465)

at com.mxgraph.svg2xml.Svg2Xml.parseFillDefs(Svg2Xml.java:1388)

at com.mxgraph.svg2xml.Svg2Xml.parseFillDefs(Svg2Xml.java:1392)

at com.mxgraph.svg2xml.Svg2Xml.parseFills(Svg2Xml.java:1305)

at com.mxgraph.svg2xml.Svg2Xml.flattenSvg(Svg2Xml.java:1292)

at com.mxgraph.svg2xml.Svg2Xml.<init>(Svg2Xml.java:317)

at com.mxgraph.svg2xml.Svg2XmlGui.actionPerformed(Svg2XmlGui.java:253)

how to launch

Example: mxGraph.aws3d.Client

Is it possible to import an SVG (with text editable, not outlined), and have the text editable inside Mxgraph?

Several attempts but unable to get slisor.svg to look correct after running this svg thru svg2xml with normalize size of x=32px and y=32px.

In the zip:

1. slisor.svg is the original icon.
2. slisor-screen-capture-of-svg.png is the expected rendition of the svg directly.
3. slisor-screen-capture-after-svg2ml.png is the resulting icon in the xml after rendering the xml in draw.io.

Is this a problem in svg2xml that can be fixed or what is causing this?

Thanks!

slisor-issue-110621.zip

For svg files that are converted to xml, svg2xml (latest version) with default options (same result by unchecking the calculate border) adds an extra box to the end of each icon in the xml:

    <rect h="32" w="32" x="0.005" y="0"/>
    <fillstroke/>
    </foreground>
</shape> 

This is an example svg that results in the above extra rect stmt at end of xml (extra square covers entire icon in this case):

<svg id="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><defs><style>.cls-1{fill:none;}</style></defs><title>user</title><path d="M16,4a5,5,0,1,1-5,5,5,5,0,0,1,5-5m0-2a7,7,0,1,0,7,7A7,7,0,0,0,16,2Z"/><path d="M26,30H24V25a5,5,0,0,0-5-5H13a5,5,0,0,0-5,5v5H6V25a7,7,0,0,1,7-7h6a7,7,0,0,1,7,7Z"/><rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32"/></svg>

Most of the svg icons I convert by svg2xml have the extra rect as above example.
A few of the conversions have no extra box.
A few of the conversions have the following code for the extra box.

     <path>
            <move x="0" y="0"/>
            <line x="0" y="32"/>
            <line x="32" y="32"/>
            <line x="32" y="0"/>
            <line x="0" y="0"/>
            <close/>
        </path>
        <fillstroke/>
    </foreground>
</shape>

This is an example svg that results in the above extra path stmts added at end of xml (extra square is in upper left of icon) using 64x64 but also tried 32x32:

<svg id="icon" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><defs><style>.cls-1{fill:none;}</style></defs><title>network--2</title><path d="M17,17h5.1421a4,4,0,1,0,0-2H17V7h5.1421a4,4,0,1,0,0-2H17a2.0023,2.0023,0,0,0-2,2v8H9.8579a4,4,0,1,0,0,2H15v8a2.0023,2.0023,0,0,0,2,2h5.1421a4,4,0,1,0,0-2H17Zm9-3a2,2,0,1,1-2,2A2.0023,2.0023,0,0,1,26,14ZM26,4a2,2,0,1,1-2,2A2.0023,2.0023,0,0,1,26,4ZM6,18a2,2,0,1,1,2-2A2.0023,2.0023,0,0,1,6,18Zm20,6a2,2,0,1,1-2,2A2.0023,2.0023,0,0,1,26,24Z"/><rect id="_Transparent_Rectangle_" data-name="&lt;Transparent Rectangle&gt;" class="cls-1" width="32" height="32" transform="translate(32 32) rotate(180)"/></svg>

To remove the extra boxes I go thru each icon in the xml and manually delete the code causing the extra box, but if there is a reason why the extra box code is appearing please let me know.

This is also mentioned on the group here:
https://groups.google.com/g/drawio/c/-BWlV-tjsTo/m/N-RAuu4iBAAJ

Thanks!

java.lang.NumberFormatException: For input string: "medium"

System:
Ubuntu 16.04,

What I did:
I have /home/astulov/Downloads/stencils with svg-files and /home/astulov/Downloads/stencils-xml/.
I set first path as source folder and second path - as destination folder. You can see it here:

Click Start.

What is expected:
xml-file with converted svg's in /home/astulov/Downloads/stencils-xml/

What I get:
No xml-files in /home/astulov/Downloads/stencils-xml/, but generated totally different folder
/home/astulov/downloads/stencils-xmlome/astulov/downloads with correct xml-file. You can see it here:

I Have downloaded this. But I don't know how to use this. Please hep me

java version "1.8.0_66"
Java(TM) SE Runtime Environment (build 1.8.0_66-b18)
Java HotSpot(TM) 64-Bit Server VM (build 25.66-b18, mixed mode)

Following command "java -jar mxgraph-core.jar" does not lounch app

Could you help?

Is it possible to import an SVG with SEPARATE LAYERS, and have each layer as a INDIVIDUAL SHAPE inside mxgraph?

Here are errors in floating point precision, though the rounding option is presented. Please see the screenshot below.

Destination folder:C:\Users\Administrator\Documents
parsing demoSvg using 0 configs
java.lang.NumberFormatException: For input string: "30.493C141.45"
at sun.misc.FloatingDecimal.readJavaFormatString(FloatingDecimal.java:1250)
at java.lang.Double.valueOf(Double.java:504)
at com.mxgraph.svg2xml.Shape2Xml.getPathParam(Shape2Xml.java:1478)
at com.mxgraph.svg2xml.Shape2Xml.matrixTransformPathPartMove(Shape2Xml.java:1351)
at com.mxgraph.svg2xml.Shape2Xml.parseMatrixTransformPathPart(Shape2Xml.java:944)
at com.mxgraph.svg2xml.Shape2Xml.matrixTransformPath(Shape2Xml.java:901)
at com.mxgraph.svg2xml.Shape2Xml.parse(Shape2Xml.java:291)
at com.mxgraph.svg2xml.Svg2Xml.(Svg2Xml.java:474)
at com.mxgraph.svg2xml.Svg2XmlGui.actionPerformed(Svg2XmlGui.java:249)
at javax.swing.AbstractButton.fireActionPerformed(AbstractButton.java:2018)
at javax.swing.AbstractButton$Handler.actionPerformed(AbstractButton.java:2341)
at javax.swing.DefaultButtonModel.fireActionPerformed(DefaultButtonModel.java:402)
at javax.swing.DefaultButtonModel.setPressed(DefaultButtonModel.java:259)
at javax.swing.plaf.basic.BasicButtonListener.mouseReleased(BasicButtonListener.java:252)
at java.awt.Component.processMouseEvent(Component.java:6516)
......
my svg file:
path d="M142.49,30.493C141.45,6.455,94.925,0.499,70.118,0.499 c-23.781,0-70.643,6.674-69.62,29.994c1.04,24.036,46.525,29.992,72.032,29.992C96.651,60.485,143.512,54.053,142.49,30.493z M79.768,55.718c-17.233,1.908-34.803-11.426-36.193-30.697c-1.022-14.042,4.825-18.09,19.31-19.756 c17.219-1.908,34.803,11.184,36.529,30.466C100.436,49.773,94.589,54.294,79.768,55.718z" transform="matrix(0.6056338,0,0,1.033333,32.69718,26.48333)" fill="#000000" stroke="none" stroke-opacity="0"

I understand you say "run it as a java application" but could you be more clear? There is no launchable file that I can find. Any direction you can provide to get this running would be very much appreciated.

We have a standard svg file, wonder to extract mutiple shapes through svg2xml, but only one shape is extracted. We saw the tool has some TODO in config, any plan about them?