D3.js 如何在D3中的行上添加文本？

这是我前面的问题

我正在尝试使用以下输入在箭头上添加文本

x1,y1,x2,y2,Flag,text
1,2,3,2,L,AA
3,3,5,3,R,BB 
5,3,6,3,L,CC 
7,5,7,5,R,DD
8,6,8,6,L,EE 
9,7,2,7,L,FF

我找到了下面的代码，但不确定如何使用它在每个箭头上添加文本

var myText =  svg.append("text")
   .attr("y", height - 10)//magic number here
   .attr("x", function(){ return x(lineEnd)})
   .attr('text-anchor', 'middle')
   .attr("class", "myLabel")
   .text(d.text);

---

只需要在添加行时添加文本

例如：

svg.selectAll(null)
      .data(data)
      .enter()
      .append("text")
      .attr("x", d => (d.x1+d.x2)/2) //I am putting the text on the middle of x and y length of th eline. But you may change it as per your need.
      .attr("y", d => (d.y1+d.y2)/2)
      .attr("font-size", "10")
      .text((d)=>d.text)

工作代码如下：

const csv=`x1，y1，x2，y2，标志，文本
1,2,3,2,1,AA
3,3,5,4，R，BB
5,3,6,3，L，CC
7,5,8,5，R，DD
8,6,9,6，L，EE
9,7,2,8，L，FF`；
const data=d3.csvParse（csv，函数（d）{
d、 x1=+d.x1*20；
d、 y1=+d.y1*15；
d、 x2=+d.x2*20；
d、 y2=+d.y2*15；
返回d；
});
data.forEach（函数（d）{
如果（（d.flag==“L”和&d.x1d.x2））d.x1=d.x2+（d.x2=d.x1，0）；
});
const svg=d3.选择（“svg”）；
const marker=svg.append（“defs”）
.附加（“标记”）
.attr（“id”、“标记”）
.attr（“视图框”、“0 10 10”）
.attr（“参考文献”，“5”）
.attr（“参考文献”，“5”）
.attr（“markerWidth”、“6”）
.attr（“markerHeight”、“6”）
.attr（“方向”、“自动”）
.append（“路径”）
.attr（“d”，“M00L105L010Z”）；
常量enterSelection=svg.selectAll（空）
.数据（数据）
.输入（）
.附加（“行”）
.attr（“x1”，d=>d.x1）
.attr（“y1”，d=>d.y1）
.attr（“x2”，d=>d.x2）
.attr（“y2”，d=>d.y2）
.attr（“标记结束”，“url（#标记）”）
.style（“笔划宽度”、“1px”）
.风格（“笔划”、“黑色”）；
svg.selectAll（空）
.数据（数据）
.输入（）
.append（“文本”）
.attr（“x”，d=>（d.x1+d.x2）/2）
.attr（“y”，d=>（d.y1+d.y2）/2）
.attr（“字体大小”，“10”）
.text（（d）=>d.text）