问题标签 [tspan]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
963 浏览

javascript - 未显示 tspan (SVG) 中的超链接

使用 tspan 处理 Javascript 到聊天室消息。
原文:此函数为 svg 中的每个项目添加名称和内容文本到 tspan

现在想显示类似于 html 的超链接(可点击样式)

主意:

ps搜索URL后面会实现。
在这个阶段,重点是在tspan
示例网站中显示超链接,仅用于测试

检查了https://www.w3.org/TR/SVG/text.html#TSpanElement<a>里面似乎没问题<tspan>谁能
给出建议为什么这不起作用?

完整的源代码:
https ://www.sendspace.com/file/2xhpk8


感谢罗伯特朗森的投入,新的想法:

但不工作


添加文本不应该使用text
弄清楚如何显示文本但没有链接效果

0 投票
0 回答
233 浏览

d3.js - D3.JS朝阳旋转

我正在 通过添加多行标题来构建我自己的旭日形图.

这在初始状态下工作得非常好,但是当您通过单击某个分区来缩放它时,一切都会变得混乱。该脚本仅移动第一行元素并且不隐藏不应出现在屏幕上的其他元素。

我如何为每个分区进行转换? 我试图通过“tspan”或其样式类进行选择。

是否可以通过重新分配名称和重新创建来完全更新块

0 投票
1 回答
672 浏览

d3.js - D3.JS 动态替换

我使用 sunburst 示例作为基础,并尝试在单击新数据时更改多行标题。点击函数如下所示:

}

PS:在本例中,初始字幕应替换为“TEST”。

但它不起作用,什么也不显示。我做错了什么?提前致谢。任何意见将是有益的。

0 投票
1 回答
788 浏览

svg - SVG tspan 与 text-anchor="end" 不对齐的问题

我有一些这样的代码:

问题在于最后三个 tspan。它们都是右对齐的,但在 Chrome 和 Firefox 中,最后三个比前两个更靠近右边缘。在 IE 11 中,这不会发生。

谁能告诉我可能是什么原因?这是一个屏幕截图:

在此处输入图像描述

谢谢!

0 投票
2 回答
10358 浏览

javascript - D3.js 将 tspan 附加到文本元素

我有一个 D3 条形图。当我将鼠标悬停在其中一个栏上时,会出现文本。

但我希望另一行文字也出现。为此,我需要附加一个 <tspan> 元素。

我已经看过示例,但无法将 <tspan> 附加到文本元素。

图表在这里,完整代码在github 上

附加了“文本”并附加了“tspan”,

JS函数handleMouseOver

0 投票
1 回答
586 浏览

svg - SVG:如何从 tspan 中删除文本锚设置为中间的多行文本的偏移量?

我有一些多行文本,我正在使用<text><tspan>处理它。我希望每一行都居中,所以我在 main <text>tag中使用text-anchor="middle"。但是,即使使用dx=0,整个块仍会移动总长度文本。

如何制作多行<tspan>居中的 SVG 文本?

例如

0 投票
1 回答
258 浏览

javascript - 重叠 tspan 的 canvg() 问题

我需要将 svg 元素转换为 png。在转换为 png 时,文本会重叠并且无法正确对齐。

实际图像是这样的: 在此处输入图像描述

转换后的图像是这样的:

在此处输入图像描述

代码是这样的:

//这段代码在svg元素下

//------------------------------------------------ -------------------------------------------------- -----------------------------------------

//这是我用来将svg转换为png的代码:

0 投票
1 回答
135 浏览

javascript - 强制重新计算 svg 文本大小

我将 a 附加tspan到一个text节点,但浏览器没有重新计算新的大小/框

JS代码:

它总是返回0, 0,这意味着在追加后不会重新计算大小

在这种情况下如何强制重新计算?

jsfiddle

0 投票
0 回答
22 浏览

html - 在不同的浏览器中对齐 SVG 分组的 tspan

为了使网页响应,我将图形和 div 迁移到 SVG 图像。imgae 本身现在在所有浏览器中运行良好。但我也将动态填充的文本段落迁移到带有<text><tspan>元素的 SVG。当使用不同的浏览器开发工具进行模拟时,这一切都有效,值被更新并且所有比例都可以。

但是在对齐分组文本时,浏览器的行为会有所不同,这让我很头疼。我想要两列值。右列应与右对齐,右列应与左对齐。为了实现这一点,我使用text-anchor="end"了左组值。该组导致不同浏览器出现问题。

当我使用缩进、可读和可编辑(恕我直言)代码时,Chrome 和 Firefox 将前两行向左移动一个槽口(或最后一行向右移动?),IE/Edge 显示全部对齐:

FF/Chrome 左侧 - IE/Edge 右侧

<tspan>当我在元素中编写元素的代码时,<text>完全内联 FF,Chrome 可以很好地显示它,但这次 IE/Edge 将最后一行缩进到左侧。

IE 向左缩进

我可以用小提琴重现这个问题: https ://jsfiddle.net/bL16wv3z/12/

Chrome 和 FF 将右列对齐,而 IE/Edge 将显示左列对齐。

小提琴中使用的示例代码:

那么如何使对齐在所有浏览器中起作用,或者我在格式/放置中遗漏了什么?

提前致谢

0 投票
1 回答
594 浏览

matlab - Matlab中时间步长的for循环

我试图在我的代码中通过我的 tspan 运行一个 forloop,以便某些参数随时间变化(特别是每个季节)。

到目前为止,这就是我在那部分代码中的内容:

但是,我不断收到错误“未定义的函数或变量 S”。有什么见解吗?