elrumordelaluz/path-that-svg

TypeError: svgToPath is not a function

Closed this issue · 3 comments

Intended to use this package to convert the SVG I have into Compound form (no rect, circle, etc).
Heres the code I wrote

const svgToPath = require('path-that-svg')
const fs = require('fs');

fs.readFile('./Bank.svg', (err, input) => {
  svgToPath(input).then(convertedFromBuffer => {
    console.log({ convertedFromBuffer })
  })
})

SVG Code

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 194.03 149.11">
    <defs>
        <style>
            .cls-2{fill:#ccc}.cls-3{fill:#f2f2f2}.cls-4{fill:#e6e6e6}
        </style>
    </defs>
    <title>
        Bank
    </title>
    <g id="Layer_2" data-name="Layer 2">
        <g id="Objects">
            <rect x="18.81" y="59.06" width="156.42" height="78.29" style="fill:#b3b3b3"/>
            <polygon class="cls-2" points="173.71 46.4 20.33 46.4 20.33 32.32 97.02 2.15 173.71 32.32 173.71 46.4"/>
            <polygon class="cls-3" points="173.71 34.49 97.02 4.3 20.33 34.49 20.33 30.17 97.02 0 173.71 30.17 173.71 34.49"/>
            <rect class="cls-3" x="7.56" y="36.91" width="18.34" height="3.41"/>
            <polygon class="cls-4" points="22.9 43.73 10.56 43.73 7.56 40.32 25.9 40.32 22.9 43.73"/>
            <rect class="cls-3" x="168.13" y="36.91" width="18.34" height="3.41"/>
            <polygon class="cls-4" points="183.47 43.73 171.13 43.73 168.13 40.32 186.47 40.32 183.47 43.73"/>
            <rect class="cls-3" x="14.48" y="60.88" width="29.56" height="3.41"/>
            <polygon class="cls-4" points="41.04 67.7 17.48 67.7 14.48 64.3 44.04 64.3 41.04 67.7"/>
            <rect class="cls-3" x="14.48" y="131.58" width="29.56" height="3.41"/>
            <polygon class="cls-4" points="17.48 128.17 41.04 128.17 44.04 131.58 14.48 131.58 17.48 128.17"/>
            <rect class="cls-2" x="17.4" y="67.71" width="23.72" height="60.46"/>
            <rect class="cls-4" x="17.4" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="21.62" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="25.85" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="30.08" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="34.3" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="38.53" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-3" x="47.37" y="60.88" width="29.55" height="3.41"/>
            <polygon class="cls-4" points="73.92 67.7 50.37 67.7 47.37 64.3 76.92 64.3 73.92 67.7"/>
            <rect class="cls-3" x="47.37" y="131.58" width="29.55" height="3.41"/>
            <polygon class="cls-4" points="50.37 128.17 73.92 128.17 76.92 131.58 47.37 131.58 50.37 128.17"/>
            <rect class="cls-2" x="50.29" y="67.71" width="23.72" height="60.46"/>
            <rect class="cls-4" x="50.29" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="54.51" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="58.74" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="62.96" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="67.19" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="71.41" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-3" x="117.11" y="60.88" width="29.56" height="3.41"/>
            <polygon class="cls-4" points="143.67 67.7 120.11 67.7 117.11 64.3 146.67 64.3 143.67 67.7"/>
            <rect class="cls-3" x="117.11" y="131.58" width="29.56" height="3.41"/>
            <polygon class="cls-4" points="120.11 128.17 143.67 128.17 146.67 131.58 117.11 131.58 120.11 128.17"/>
            <rect class="cls-2" x="120.03" y="67.71" width="23.72" height="60.46"/>
            <rect class="cls-4" x="120.03" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="124.25" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="128.48" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="132.71" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="136.93" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="141.16" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-3" x="150" y="60.88" width="29.56" height="3.41"/>
            <polygon class="cls-4" points="176.55 67.7 153 67.7 150 64.3 179.55 64.3 176.55 67.7"/>
            <rect class="cls-3" x="150" y="131.58" width="29.56" height="3.41"/>
            <polygon class="cls-4" points="153 128.17 176.55 128.17 179.55 131.58 150 131.58 153 128.17"/>
            <rect class="cls-2" x="152.91" y="67.71" width="23.72" height="60.46"/>
            <rect class="cls-4" x="152.91" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="157.14" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="161.37" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="165.59" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="169.82" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="174.04" y="67.71" width="2.59" height="60.46" rx="1"/>
            <rect class="cls-4" x="13.18" y="57.23" width="167.67" height="3.65"/>
            <polygon class="cls-2" points="183.52 53.07 10.52 53.07 13.18 57.23 180.85 57.23 183.52 53.07"/>
            <rect class="cls-3" x="10.52" y="43.73" width="173" height="9.33"/>
            <text transform="translate(92.47 32.6)" style="font-size:17.73px;font-family:Exo-Bold,Exo Bold;font-weight:700;fill:#f2f2f2">
                $
            </text>
            <path d="M108.81,26.09A11.8,11.8,0,1,1,97,14.3,11.79,11.79,0,0,1,108.81,26.09Z" style="fill:none;stroke:#f2f2f2;stroke-miterlimit:10"/>
            <rect class="cls-2" x="10.52" y="134.99" width="173" height="4.71"/>
            <rect class="cls-4" x="5.67" y="139.7" width="182.68" height="4.71"/>
            <rect class="cls-3" y="144.4" width="194.03" height="4.71"/>
            <path d="M112.25,135V88.29a1,1,0,0,0-1-1H82.79a1,1,0,0,0-1,1V135Z" style="fill:gray"/>
        </g>
    </g>
</svg>

Hi @fardeen9983, thanks for open the Issue.

Take a look here please.

Closing but feel free to reopen or open a new Issue in any case.

no problem at all!

I take advantage of your Issue to update the readme

Thanks,