convert svg to html+css

Question

I want a converter to convert from svg format to( html + css )

<g transform="matrix(1.25,0,0,-1.25,0,15.56875)">


    <text transform="matrix(1,0,0,-1,76.881,0)">
        <tspan style="font-size: 7.87px; font-family: 'XITSMath';" x="0" y="0">N</tspan>
    </text>


    <text transform="matrix(1,0,0,-1,88.499,7.313)">
        <tspan style="font-size: 7.87px; font-family: 'XITSMath';" x="0" y="0">T</tspan>
    </text>
</g>

Now what I want to do, is to convert matrix, x and y values to CSS attributes. For Example, T here is superscript and N is subscript and this is done by transform, x and y attributes AND I want to translate this sub/super script effect to CSS in HTML document.

I have found a python script which called svg2css and another one which called svg2html, but I cant find any information about how to test them. This is svg2css script:http://sourceforge.net/projects/svg2css/files/
And this is svg2html script:http://jspoker.pokersource.info/jpoker-1.0.16/test-svg2html.py

I have found this also, it seems to be a test code for svg2html script: http://jspoker.pokersource.info/jpoker-1.0.16/test-svg2html.py

Hi friends, finally I have found a way to test svg2css python script, but it results in error message: I tried to use svg2css inkscape extension in python, which converts an svg file to its equivalent css+html, but it resulted in no output with a warning message:

Source file C:\WINDOWS\Temp\ink_ext_XXXXXX.svg9EFDKV not an SVG. My svg file is very simple, it just contains one text tag, I tried to generate the css+html from these svg formats:

1. plain svg
2. inkscape svg
3. optimized svg but all of these resulted in no output with same error message.

This is the Error Log file generated in \Users\staff\Application Data\inkscape:

Extension "Sketch Input" failed to load because a dependency was not met. Dependency: type: executable location: path string: skconvert

Extension "LaTeX Input" failed to load because a dependency was not met. Dependency: type: extension location: extensions string: org.inkscape.input.sk

I know that I should download these resources, mentioned in the error log file, and fix them, could any one help me to do this, or if there is another solution?

Solution

This only sort of works, but here you go anyway:

https://convertio.co/svg-html/

This does technically do what it says it does, however, it just splits the content into text, and everything else. It might work with simple SVGs... Although with anything of any complexity it will completely botch it... As it doesn't split rectangles into divs, rather, it rasterizes everything except for the text, which might work in some scenarios...

It didn't work for my purposes, as I built out a webpage layout style and was hoping I could just convert it into an HTML file and add some functionality, but it didn't work, I'll just have to hand-code it I guess!

Comments

[loll]

you are right,but my svg file contains <text> tags and doesnt contain any embeded or linked images

[Oded]

@loll - Quite an important detail to leave off from you question. How about editing your question and adding all of the important deatils to it?

[loll]

Thanks a lot for your help, I'll try to apply, but I hope to find a direct converter from svg to html.

[Oded]

@Loll - what you are looking for is very specific. Most SVG documents are not only text, so you are unlikely to find a general purpose SVG to HTML converter.

[loll]

yes you are right, but I just need svg to html converter no matter the content of svg file

[loll]

now I have found a python script called (svg2css), there is no lot information about using it, but it supposed to convert from svg to html+css, so I'll be very happy if any one tell me some thing about it. ko.sourceforge.jp/projects/sfnet_svg2css , sourceforge.net/projects/svg2css

[Oded]

@loll - instead of adding a comment to my answer, update your question.

[Kroltan]

Wait, SVGs aren't images, they're vectors.

[Oded]

@Kroltan - SVG is a graphical format. They are vector images, but images non the less.

[Kroltan]

@oded but they can't be represented by tables for individual pixels, unless you pre render them into a bitmap.