сделать текст ссылкой в ​​svg

Question

Я использую d3 для рисования диаграммы (я использую пример thix: https://gist.github.com/keiranlovett/8766741). Мне нужно добавить ссылку. Я добавляю текст, и я пытаюсь сделать его ссылку, но это не появляется в ссылке (я использую IE 11):

svg.append("g") //without doing this, impossible to put grid lines behind text 

    .attr({ 
      xmlns: "http://www.w3.org/2000/svg", 
      xlink: "http://www.w3.org/1999/xlink", 
      width: 100, 
      height: 300 
     }) 
    .attr({ "xlink:href": "#" }) 
    .on("mouseover", function (d, i) { 
      //alert('aaa'); 
      d3.select(this) 
       .attr({ "xlink:href": "http://example.com/" + "eeeeeeeeeeeeeeeeeee" }); 
     }) 
    .selectAll("text") 

    .data(tasks) 
    .enter() 
    .append("text") 

    .text(function (d) { 
     if (ammendmentsLinks.indexOf(d.contract) < 0) { 
      ammendmentsLinks = ammendmentsLinks + d.contract + ";"; 
      return d.contract; 
      //return ""; 
     } 
     else { 
      return ""; 
     } 
    }) 
    .attr("x", 20) 
    .attr("y", function (d, i) { 
     return i * 20; 
    }) 
    .attr("font-size", 11) 
    .attr("text-anchor", "start") 
    .attr("text-height", 14) 
    .on("click", function (d) { 
     return click(d.contract); 
    }); 

Я также добавил несколько строк кода из http://jsfiddle.net/christopheviau/B9zcF/ сделать текст ссылки, но он не работает.

Как сделать мой текст ссылкой?

Answer 1

Попробуйте изменить следующую строку:

d3.select(this) 
      .attr({ "xlink:href": "http://example.com/" + "eeeeeeeeeeeeeeeeeee" }); 

в

d3.select(this) 
      .wrap("<a xlink:href \"http://example.com/\"></a>") 
      .text("eeeeeeeeeeeeeeeeeee"); 

и убедитесь, что <svg> тег имеет xmlns:xlink="http://www.w3.org/1999/xlink" указанный.