Skip to content Skip to sidebar Skip to footer

Hyperlink In Tspan (svg) Not Shown

working on Javascript to chatroom message with tspan. Original: this function add name and content text to tspan for each of the items in svg function showMessage(nameStr, conten

Solution 1:

There are various issues:

  • the a element must be created in the SVG namespace
  • the xlink:href attribute must be created in the xlink namespace
  • the link content is the text content of the link and not an attribute

Finally you should get something like this:

var contentNode = document.createElementNS("http://www.w3.org/2000/svg", "tspan");

        // Set the attributes and create the text
        contentNode.setAttribute("x", 200);
        contentNode.setAttribute("fill", color);

        var a_tag = document.createElementNS("http://www.w3.org/2000/svg", "a");
        a_tag.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", "http://google.com");
        a_tag.appendChild(document.createTextNode("google"));

        contentNode.appendChild(a_tag);


        // Add the name to the text node
        node.appendChild(contentNode);

Post a Comment for "Hyperlink In Tspan (svg) Not Shown"