oraz oraz - 1 year ago 84
Javascript Question

Updating text link URL in d3

I am trying to implement a link in the tooltip of a line chart in d3.
Similar to this.

The link will be an attribute of the data so I want to be able to change the link, as the tooltip focuses over different parts of the data.

I am not using a div because I want to have a responsive page, and don't want to use absolute positioning.

I can't figure out how to change the link after it had been set.
So, far I have just tried calling:

.attr("xlink:href", 'http://www.yahoo.com')

a second time, but this does not update it.

A jsfiddle example is here.

Thanks for any help.

Answer Source

You are adding the href to text DOM so instead of this:

 d3.select('.tlink') //it will give you the text DOM
     .attr("xlink:href", 'http://www.yahoo.com') //< link does not change?
     .style('fill', 'red');

Do this:

 d3.select('a')//select anchor 
     .attr("xlink:href", 'http://www.yahoo.com') //< link does not change?
     .style('fill', 'red');

working code here

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download