search

svg-net / SVG

Fork of the ms svg library
http://svg-net.github.io/SVG/
Microsoft Public License
1.16k stars 473 forks source link

Vertical text is rendered horizontal #923

Open TodorVyagov opened 2 years ago

TodorVyagov commented 2 years ago

The "writing-mode" style attribute is not respected. I found out that vertical text orientation can be achieved using "tb" or "vertical-lr" values of the "writing-mode" attribute. https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/writing-mode

SVG with vertical text is rendered horizontal. Here is a sample SVG:

<svg width="200" height="200" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<g>
    <text style="font-size:20px;writing-mode:tb;" x="30" y="30">
        Vertical text
    </text>
    <text style="font-size:20px;writing-mode:vertical-lr;" x="50" y="50">
        Text 2
    </text>
</g>
</svg>

Rendered using SVG.NET: image

Here is how it is rendered in the Edge browser: image

mrbean-bremen commented 2 years ago

Can also be seen in the W3C test image text-intro-03-b.svg. One of the style tags that is not supported yet.