So I have the following code to visualize a tree using the d3js library. My problem lies in the nodeEnter.append("text") portion for actually assigning the text value. For some reason it won't register that I've put a newline \n character in my text assignment because the text doesn't go to a newline in the rendering of the svg. Also, I want my text to be hidden normally and appear on mouseover; however, this doesn't work. Instead I managed to get the opposite functionality to work (hide on mouseover). Can somebody tell me how to get the mouseover funcitonality I want, and how to make the "\n" character actually send the remainder of the text to a newline?
TY
nodeEnter.append("text")
.attr("x", function(d) { return d.children || d._children ? -10 : 10; })
.attr("dy", ".35em")
.attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; })
.text(function(d) { return d.name+"\n"+d.text; })
.style("fill-opacity", 1e-6)
.style("visibility","visible")
.on("mouseenter", function(){d3.select(this)
.style("visibility", "hidden")
.transition()
;})
.on("mouseleave", function(){d3.select(this)
.style("visibility", "visible")
.transition()
;});
(Basically wherever it has visibility set to visible I want it hidden, and wherever it is hidden I want it visible)