Question

这是阻止我理解协调系统如何运作的唯一因素......

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
     width="600" height="400" x="0" y="0">  
    <text x="0" y="0">  
        <tspan>&#x2709;</tspan>
    </text>  
</svg>

如果y轴指向下方为什么y="0"从视口外部开始？它不应该从顶部边缘开始吗？它打破了我的逻辑...

x轴指向右侧，它从视口的左边缘开始，现在这是逻辑和正常行为。

为什么y轴表现得像这样？或者为什么要从外部开始而另一个不开始？这背后的逻辑是什么？除非我误解它是如何运作的......

Answer 1

全部在SVG specification

中

初始坐标系的原点位于顶部/左侧，x轴指向右侧，y轴指向下方

文字的来源基本上是bottom left corner of the glyph for left-to-right text。

对于拉丁文本的大多数用法（即，写入模式：lr，text-anchor：start和alignment-baseline：baseline），字形中的对齐点将是字形单元格的左边缘的交集（或者一些其他字形特定的x轴坐标，表示左侧原点）与字形的拉丁基线。

svg：为什么y =“0”从视口外开始而不是在文本的上边缘？

1 个答案: