问题标签 [tspan]

我已将我的问题简化为一个最小的工作示例。此代码段不会显示任何文本：

现在，如果我注释掉这两个g标签，则会显示文本：

为什么会发生？我正在通过htlatex以下 tikz 文档生成 svg：

我不知道这里发生了什么。我真的很感激任何形式的意见！

以下代码将“世界”显示为x位置的连续流动。我们可以指定x="200"那一秒<tspan>，使其与左边缘的“Hello”对齐。但是有没有办法在不需要指定绝对值x的情况下做到这一点200？

就像如果我们有一个<div>，然后我们有两个<div>s ，左边缘将对齐，而无需x为父级指定绝对值，为x子级指定绝对值：

我想过使用

它在 Chrome 中不起作用。

我想用js修改，但我做不到。我没有错误信息。

js

svg/html

I am working with a JS charting library that I did not write and I would like to add some functionality to insert HTML content in the element of an SVG graphic. The reason is that it contains a mix of RTL and LTR text:

Notice that the % symbol is at the wrong end of the string. To fix this, I'd like to add a tspan element with the LTR content:

I have located the code that adds the text element:

EDIT: One of my goals is to keep the percentage figure as one unit so that it's expressed as "99 %" or "% 99" in the markup itself.

Thanks!

Rob

请检查我的代码链接

如何设置 SVG 标签的宽度和高度以适合其内容（tspan 标签）。tspan 标签的数量不固定。

谢谢

我有一些 Unicode 文本段落。我想做的是将这些段落转换为图像。我选择的流程是先将文本转换为 SVG，然后再转换为 png。

我为此使用 python，目前不使用任何第三方库，因为它只是简单的文本处理。（每行的 tspan 元素）

我面临的问题是有些句子很长并且超出了视图框。有没有办法找出适用于所有段落/图像的一致字体大小。？

或者换句话说，有没有办法计算给定字符串的高度和宽度（以像素为单位）？

谢谢

这个问题是相关的，但使用 javascript 代替。

text-anchor如何在不使用属性的情况下对齐文本标签中的文本？我的问题是使用text-anchor将改变解释x和y属性的方式，我不希望这样，因为我已经完美地设置了这些元素组的位置：

而且我不希望它被改变，因此重新编码整个 svg 设置只是为了文本布局目的。例如，如果我在text-anchor="middle"这里应用 a ，这会使文本居中，但它将 x (206) 更改为文本的中心。我使用 svg 中的 x 值将文本元素放置在系统中的精确位置，因此 x 坐标的其他解释 1) 破坏了整个布局，2) 甚至无法精确放置文本元素，因为插入文本可能具有可变长度，因此无法预测文本标签所需的 x 坐标以将其放置在您想要的位置。所以我想一定有更好的方法来达到我想要的？

在text元素 a内tspan，允许对文本的特定部分进行样式设置。

tspan正确地位于文本之后。

但是，当font-size超过200px该位置时开始表现不同。

的内容text也会受到影响。如果你愿意，你可以检查自己。

字体越大，差异越大。这是font-sizeat的结果400px。

_{相对单位(em和%) 已经过测试。 其他text相关元素( a) 也已经过测试。}

X 属性是 tspan 元素的绝对 X 坐标。但是我们检查输出是否占用了更多像素。而不是 tspan 元素需要从 30 个像素绘制，而是从 39 个像素绘制。为什么会这样？我的期望是它必须从 30 像素中绘制 在此处输入图像描述

我已经使用导入了一个 SVG 并且我正在尝试访问<tspan>innerText，因为我需要更改它，但是当我使用添加id="test"到 tspan时document.getElementById('test');不会产生任何结果......

我怎么解决这个问题？

我知道我可以使用 更改内部文本element.innerText，但我的结果为空...

我的 SVG：

我的 HTML：

到目前为止，我正在浏览器控制台中运行 JS。