D3.js 对D3生成的文本对象的子字符串执行操作_D3.js

D3.js 对D3生成的文本对象的子字符串执行操作

d3.js

D3.js 对D3生成的文本对象的子字符串执行操作,d3.js,D3.js,我想知道，当用户正在进行数据可视化时，是否有叙述性文本段落在网页的一侧向下滚动。作为其中的一部分，最好将功能添加到该文本的某些子字符串中，例如打开与其相关的弹出图像。但我想不出任何方法来告诉D3将文本元素的子字符串对象化，以便它们能够响应mouseover之类的运算符举个例子子串单击世界上最有趣的变量链接=”https://en.wikipedia.org/wiki/The_Most_Interesting_Man_in_the_World"; d3.选择（“身体”）.selectAl

我想知道，当用户正在进行数据可视化时，是否有叙述性文本段落在网页的一侧向下滚动。作为其中的一部分，最好将功能添加到该文本的某些子字符串中，例如打开与其相关的弹出图像。但我想不出任何方法来告诉D3将文本元素的子字符串对象化，以便它们能够响应mouseover之类的运算符

举个例子


子串单击
世界上最有趣的
变量链接=”https://en.wikipedia.org/wiki/The_Most_Interesting_Man_in_the_World";
d3.选择（“身体”）.selectAll（“div”）.append（“文本”）.text（“世界上最有趣的人”）；
//有没有办法让“人”链接到“维基链接”或执行其他操作？

是的，这是可能的，但您需要以符合

d3

的方式格式化数据

var data=[{text:'最有趣的'，href:false}，
{文本：'man'，href:'https://en.wikipedia.org/wiki/The_Most_Interesting_Man_in_the_World' },
{text:'in the world'，href:false}]；
var text=d3。选择（“正文”）。选择全部（“div”）。追加（“文本”）；
text.selectAll（'tspan'）
.数据（数据）
.输入（）
.append（'tspan'）
.html（函数（d）{
返回d.href
? '' 
：d.文本；
});

谢谢！我想我能想出一个这样的格式：）

<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
    <title>Substring click</title>
    <script type="text/javascript" src="scripts/d3.v3.js"></script>
</head>
<body>
<!-- example line -->
<p>The most interesting <A href="https://en.wikipedia.org/wiki/The_Most_Interesting_Man_in_the_World">man</A> in the world</p>
<div/>

<script type="text/javascript">

var link = "https://en.wikipedia.org/wiki/The_Most_Interesting_Man_in_the_World";

d3.select("body").selectAll("div").append("text").text("The most interesting man in the world");

// is there any way to make 'man' link to 'wiki_link' or perform some other operation?

</script>
</body>
</html>