SVG文件中的文本元素 - 从顶部y开始

时间:2013-04-04 09:38:56

标签: xml html5 svg

这是我的SVG文件: $ http://jsfiddle.net/fHdYC/

为什么我看不到所有文字?我想从posx = 0,posy = 0

开始写作

2 个答案:

答案 0 :(得分:1)

文本放在位置(0,0)但是对于svg中的文本,(0,0)是放置文本基线的位置。这意味着文本将从基线向上延伸(在您的示例中,由于此原因,文本最终会在可见区域之外)。

您应该将您的y位置调整到您想要该基线的位置。

一种方法是使用em个单位,因为它们依赖于fontsize。设置y="1em"并且文本应该可见(当然也取决于您的坐标系/ viewBox)。请参阅http://jsfiddle.net/8MpyY/

答案 1 :(得分:0)

http://jsfiddle.net/a4p52/

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="2551" height="3578">
<g name="text_group" id="group_lay_29073" >
    <text x="0" y="0" font-family="Arial" font-size="30" fill="#000" alignment-baseline="hanging" text-anchor="start" font-style="normal" >Loremp ipsum</text>
</g>

使用“text-anchor”和“alignment-baseline”。