d3在点击时生成SVG但我再也无法点击了

Question

我将节点放在地图上，以及点击节点时。我想显示它的边缘。但是，生成绘制链接的svg会覆盖其他一些节点。通过这个，我并不意味着它在视觉上覆盖，但是当我检查元素时，svg对象有时会在相邻节点上分层。这意味着我无法点击这些节点。如何让点击进入节点。

我在哪里看到我应该使用CSS

pointer-events:none; 

但是，这不起作用。这是我的CSS代码

.colleges, .colleges svg {
 position: absolute;
}

.colleges svg {
 width: 60px;
 height: 20px;
 padding-right: 100px;
 font: 10px sans-serif;
}

.colleges circle {
   fill: brown;
   stroke: black;
   stroke-width: 1.5px;
}

.links svg {
   pointer-events:none; 
}

.links line {
   position: absolute;
   stroke: black;
   stroke-width: 2px;
   pointer-events:none; 
}

这是我用来生成边缘的代码

var markerLink = layer.selectAll(".links")
      .data(links)
      .each(pathTransform) // update existing markers       
      .enter().append("svg:svg")
      .attr("class", "links")
      .each(pathTransform);

function pathTransform(d) {
        var t, b, l, r, w, h, currentSvg;
        var d1=new Object();
        var d2=new Object();
        $(this).empty();

        d1.x=node_coord[indexMap[d.from] + "," + 0]
        d1.y=node_coord[indexMap[d.from]  + "," + 1]
                 d2.x=node_coord[indexMap[d.to]  + "," + 0]
                 d2.y=node_coord[indexMap[d.to]  + "," + 1]

                if (d1.y < d2.y) {
                    t = d1.y;
                    b = d2.y;
                } else {
                    t = d2.y;
                    b = d1.y;
                }
                if (d1.x < d2.x) {
                    l = d1.x;
                    r = d2.x;
                } else {
                    l = d2.x;
                    r = d1.x;
                }
                currentSvg = d3.select(this)
                  .style("z-index","1")
                  .style("left", (l + 2*radius) + "px")
                  .style("top", (t + 2*radius) + "px")
                  .style("width", (r - l + 2*radius) + "px")
                  .style("height", (b - t + 2*radius) + "px");


                var x1=0,y1=0,x2=0,y2=0;
                if ((d1.y < d2.y) && (d1.x < d2.x)) {
                  x2=r-l;
                  y2=b-t;
                } else if ((d1.x > d2.x) && (d1.y > d2.y)) {
                  x2=r-l;
                  y2=b-t;
                } else if ((d1.y < d2.y) && (d1.x > d2.x)) {
                  x1=r-l;
                  y2=b-t;
                } else if ((d1.x < d2.x) && (d1.y > d2.y)) {
                  x1=r-l;
                  y2=b-t;
                            }
                currentSvg.append("svg:line")
                                    .style("stroke-width", 2)
                                    .style("stroke", "black")
                                    .attr("x1", x1)
                                    .attr("y1", y1)
                                    .attr("x2", x2)
                                    .attr("y2", y2);

                return currentSvg;
            }