Text in SVG dont shown at the Chrome and IE

Question

I have some network stuff images as Microsoft Visio elements set file (.vss). I convert it to the SVG files.

It converts okay, but Chrome 29 and IE9 doesnt show text in it. Opera 12 and Firefox 24 show text (but Firefox have kerning problems).

Text is very important here, bcz that SVGs should be used as a reference-book with port numbers etc.

How can I fix texts here?

Sample SVG file

Screenshot of this SVG file at the different browsers:

Answer 1

I have seen problems with SVG rendering when you have a Visio drawing with embedded word document (or some other file like that embedded using "insert object"). If you have that try converting them into native visio format first and then exporting to SVG again - may help. Your file now has "svg" in "svg".

Anyways, the issue looks like a bug (one more) in the IE9 SVG rendering :-) Basically, it appears that the following code fragment is rendered incorrectly in IE9 (full example):

<svg width="10in" height="10in" viewBox="0 0 10 10" 
     xmlns="http://www.w3.org/2000/svg" >

    <g transform="matrix(100, 0, 0, 100, 2, 2)">
      <text font-size="0.01">FOO</text>
    </g>

</svg>

The thing is, the font is first upscaled x100 times and then downscaled x100 times (which is a silly thing to do from Visio SVG exporting engine), but anyways other browsers deal with it somehow).

It might be helpful if you could share the original visio drawing.

Answer 2

When logging to the Chrome console, i see your text exists in very small sizes :

<g xmlns="http://www.w3.org/2000/svg" font-size="0.010081" font-family="ARIAL" font-weight="bold"> <text stroke="none" xml:space="preserve" xmlns:xml="http://www.w3.org/XML/1998/namespace" x="0.028478 0.035202 0.04136 0.049202 0.054808" y="0.009073 0.009073 0.009073 0.009073 0.009073">Power</text> </g>

and around that a matrix transform. I don't know where the culprit lies, and opening in Illustrator is a mess…

What i got in brackets was to remove the text-rendering="geometricPrecision" attribute in the group above. I'll see if i can find more precision on this one after.