如何启用标记end以结束d3树中路径

<script src="https://d3js.org/d3.v7.min.js"></script>

<svg id="tree"></svg>

var treeData = {
  name: "Root",
  children: [
    {
      name: "Node 1",
      children: [
        { name: "Leaf 1" },
        { name: "Leaf 2" }
      ]
    },
    {
      name: "Node 2",
      children: [
        { name: "Leaf 3" },
        { name: "Leaf 4" }
      ]
    }
  ]
};

var treeLayout = d3.tree().size([width, height]);

var rootNode = d3.hierarchy(treeData);
var treeNodes = treeLayout(rootNode).descendants();
var treeLinks = treeLayout(rootNode).links();

var svg = d3.select("#tree");

var links = svg.selectAll(".link")
  .data(treeLinks)
  .enter()
  .append("path")
  .attr("class", "link")
  .attr("d", function(d) {
    return "M" + d.source.x + "," + d.source.y
      + "C" + d.source.x + "," + (d.source.y + d.target.y) / 2
      + " " + d.target.x + "," + (d.source.y + d.target.y) / 2
      + " " + d.target.x + "," + d.target.y;
  });

var nodes = svg.selectAll(".node")
  .data(treeNodes)
  .enter()
  .append("circle")
  .attr("class", "node")
  .attr("cx", function(d) { return d.x; })
  .attr("cy", function(d) { return d.y; })
  .attr("r", 4);

svg.append("defs")
  .append("marker")
  .attr("id", "end-marker")
  .attr("viewBox", "0 -5 10 10")
  .attr("refX", 10)
  .attr("refY", 0)
  .attr("markerWidth", 6)
  .attr("markerHeight", 6)
  .attr("orient", "auto")
  .append("path")
  .attr("d", "M0,-5L10,0L0,5")
  .attr("fill", "black");

links.attr("marker-end", "url(#end-marker)");