计算SVG文本的垂直高度

Calculating vertical height of a SVG text

本文关键字:垂直 高度 文本 SVG 计算      更新时间:2023-09-26

我有一个字符串数组。说,

['Jan 11','Feb 11']

我要创建一个垂直文本用这些字符串像这样

<text x="60" y="154" text-anchor="middle" style="text-anchor: middle; font: normal normal normal 12px/normal Helvetica, Arial; " font="12px Helvetica, Arial" stroke="none" fill="#ffffff" transform="rotate(90 59.75 150)">
<tspan>Jan 11</tspan>
</text>

在svg渲染后,我发现文本的高度是36px。现在是否有一种方法可以计算文本的高度,该高度将在给定字体大小之前呈现?

可以使用getBBox方法计算SVG节点的尺寸

var textNode = document.getElementsByTagName('text'),
    bbox = textNode.getBBox();
//bbox now have x, y, width and height properties