search

vlandham / bubble_chart_v4

d3v4 implementation of bubble charts.
Other
60 stars 70 forks source link

problem with tooltips #2

Open alexmc6 opened 7 years ago

alexmc6 commented 7 years ago

Hello,

Thanks for the great example of using D3V4. I have gotten it responding to buttons so that the force changes the location of the bubbles.

However, I am having trouble with the tooltip.js and I wonder if you have seen this problem before. I can see that you don't seem to have the same problem as me so it is presumably something in my setup.

Everything seems to work fine except that when I hover over a circle the tooltip code gets as far as to showTooltip and even updatePosition but when it reaches

function updatePosition(event) { var xOffset = 20; var yOffset = 10; var ttw = tt.style('width');

I get Uncaught TypeError: Cannot read property 'ownerDocument' of null at window (d3.self-f933ecc….js?body=1:1297) at Selection.selection_style [as style] (d3.self-f933ecc….js?body=1:1329) at updatePosition (tooltip.self-6c84d32….js?body=1:54) at Object.showTooltip (tooltip.self-6c84d32….js?body=1:36) at SVGCircleElement.showDetail (bubble_chart.self-b057718….js?body=1:288) at SVGCircleElement. (d3.self-f933ecc….js?body=1:821)

From debugging this I can see that tt exists - and seems to have a node() but the error says whatever node() returns doesn't have an ownerDocument. And that confuses the heck out of me.

Now I am using your example inside a Rails app which has its own javascript pipeline - not the same one you used. I was worried that the tooltip object was being created too early - BUT it seems to be created at the same time as the rest of the chart - and that is being displayed fine for me.

If you have any ideas I would much appreciate it.

Thanks

vlandham commented 7 years ago

interesting!

I unfortunately haven't kept up with the current state of Rails JS pipelines, so I'm not exactly sure how to go about debugging.

perhaps the initial d3.select('body') isn't getting the body that is expected? and so tt isn't really attached to the DOM?

just pondering. You could modify that d3.select('body') to have it select some div inside the page and see if the error persists. ( the tooltip wouldn't work correctly - but perhaps could lead down what the main issue is).