oslllo / svg-fixer

Converts SVG Strokes To Fill.
https://docs-oslllo-com.onrender.com/svg-fixer/master
MIT License
213 stars 19 forks source link

output viewbox not set correctly #82

Closed Granaat closed 2 years ago

Granaat commented 2 years ago

When using a viewbox that doesn't has min-x & -y as 0 the outputted svg code is offset to the center of the svg. The original viewbox is copied, however, it should be changed to "0 0 w h" in order to be displayed correctly.

for example: <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-270 -270 540 540" fill="none" stroke="#000000" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"><g><circle cx="0" cy="0" r="250" class="fill65535" /><circle cx="0" cy="0" r="150" class="fill255" /><circle cx="0" cy="0" r="250" /><circle cx="0" cy="0" r="150" /></g></svg>

results in

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-270 -270 540 540" fill="none" stroke="#000000" stroke-width="20" stroke-linecap="round" stroke-linejoin="round"><path d="M256.905 10.281 C 198.361 13.127,142.394 35.861,98.280 74.714 C 53.736 113.946,23.877 167.123,13.791 225.180 C 8.714 254.399,8.714 285.601,13.791 314.820 C 28.004 396.635,81.074 467.164,155.925 503.713 C 200.196 525.330,248.921 533.804,298.485 528.506 C 362.734 521.639,422.705 490.325,465.733 441.180 C 488.966 414.644,506.488 383.836,517.405 350.325 C 534.246 298.631,534.246 241.369,517.405 189.675 C 501.908 142.108,473.221 100.286,434.160 68.317 C 395.643 36.792,347.942 16.815,298.485 11.497 C 285.567 10.107,269.904 9.650,256.905 10.281 M279.720 30.247 C 303.364 31.304,323.463 34.955,345.330 42.163 C 383.798 54.844,418.040 76.857,445.832 106.771 C 467.022 129.579,482.804 154.878,494.099 184.140 C 510.356 226.255,514.232 273.313,505.131 318.060 C 497.128 357.406,478.949 394.791,453.074 425.115 C 444.982 434.598,435.278 444.340,425.939 452.355 C 397.631 476.649,364.258 493.838,327.645 502.981 C 290.739 512.198,249.965 512.246,212.940 503.118 C 167.070 491.810,126.308 467.824,94.168 433.229 C 68.250 405.331,49.620 372.309,39.169 335.745 C 26.369 290.961,27.085 241.587,41.170 197.640 C 52.275 162.993,70.033 132.592,94.393 106.522 C 123.082 75.820,157.494 54.038,197.640 41.170 C 223.429 32.905,252.531 29.032,279.720 30.247 M265.005 110.064 C 236.057 110.959,208.094 119.613,183.658 135.239 C 164.664 147.383,147.383 164.664,135.239 183.658 C 122.286 203.914,113.913 227.189,111.124 250.695 C 109.700 262.692,109.701 277.004,111.128 289.305 C 113.825 312.551,122.293 336.097,135.239 356.342 C 147.371 375.316,164.684 392.629,183.658 404.761 C 203.958 417.742,227.533 426.206,250.830 428.877 C 263.297 430.307,276.501 430.305,289.170 428.872 C 317.212 425.699,345.400 414.111,368.145 396.404 C 399.590 371.924,420.927 336.472,427.644 297.540 C 429.288 288.013,429.904 280.502,429.904 270.000 C 429.904 259.498,429.288 251.987,427.644 242.460 C 423.231 216.886,412.396 192.397,396.404 171.855 C 368.561 136.090,326.652 113.595,282.015 110.455 C 277.602 110.145,268.874 109.944,265.005 110.064 M281.340 130.538 C 298.970 131.996,314.988 136.362,330.969 144.066 C 359.144 157.647,382.353 180.856,395.934 209.031 C 405.336 228.535,409.853 248.321,409.853 270.000 C 409.853 288.704,406.583 305.507,399.562 322.873 C 386.785 354.482,361.772 381.120,330.955 395.938 C 311.354 405.363,291.687 409.853,270.000 409.853 C 248.321 409.853,228.535 405.336,209.031 395.934 C 180.856 382.353,157.647 359.144,144.066 330.969 C 134.651 311.439,130.147 291.708,130.147 270.000 C 130.147 248.308,134.658 228.546,144.066 209.031 C 157.653 180.843,180.843 157.653,209.031 144.066 C 222.796 137.430,236.644 133.277,251.910 131.206 C 259.731 130.145,272.956 129.845,281.340 130.538 " stroke="none" fill="black" fill-rule="evenodd"></path></svg>

Ghustavh97 commented 2 years ago

@Granaat Hi, thanks for the issue. please try out v2.2.0, the issue should be fixed now.