I am having a very strange problem – I am using more or less the same code as the scatterplot sample on the nvd3 web site (but hooked into my ember.js app) and I’m seeing a beautiful plot come out only to be marred about 500ms later by a set of black circles that are much larger but follow the same contour of the plot.
If I comment out this line in nv.d3.js:
gEnter.append('g').attr('class', 'nv-point-paths');
this doesn’t seem to happen and the graph “works” ala without the animations.
Has anyone seen something like that before?
I have just come across this issue myself, and I think I have figured it out, although I am not sure why it’s not explained better on the nvd3 pages anywhere.
You need to include a reference to the nvd3 stylesheet in your html which is the
./src/nv.d3.cssfile in the download/github repo.My guess is that the black circles are the hover regions for each point on the chart, and the default style for a path in SVG is black filled.
I have raised an issue on github to see if we can get the installation instructions for nvd3 improved: https://github.com/novus/nvd3/issues/19.