i think the problem relates to the use of transitions. there are four places where the
chart function is called with a selection that has been returned from
.transition(), and that appears not to work.
three of the four changes are in lines 63, 69 and 74 of
d3linewithlegend.js. each of these three lines reads as follows:
replace each line with
finally, in the
index.html file, replace
after making this change, hovering over the legend worked for me, in chrome, firefox and edge.
transitions were overhauled in d3 version 3.0, so it's perhaps not a surprise that d3 v2 code involving them doesn't work in d3 v3. i can't say i understand them well enough to know exactly where the problem is, but i did observe that if enter the following line in the console
then d3 throws the same exception that i got when i tried to view the visualization you linked to. this led me to avoid a situation where
transition() was being called on a selection returned by a call to
- Error in A Simple D3 Line chart with Legend and Tooltips for D3v 3.5.13
- Tooltips for multiple lines chart with legend click d3.js
- Time in x-axis and data for the y-axis for line chart in d3.js doesn't match/show with what (data) is on JSON
- d3.js creating a simple line chart with array of DateTime and int
- D3.JS time-series line chart with real-time data, panning and zooming
- nvd3.js-Line Chart with View Finder: rotate axis labels and show line values when mouse over
- Special donut chart with different rings/arcs for positive and negative values
- Line chart using ordinal x-axis with d3.js and nvd3.js
- Draw D3 Simple Line chart With an Array
- Mix bar and line charts with Rickshaw (d3 based graphing library for js)
- d3 v4 drag line chart with x and y axes
- How do I implement d3's enter update exit pattern for an area chart with focus and context?
- Align lines and dots with x-axis values in line chart
- Grouped bar chart with zoom and updateable data error
- C3js - combination chart with data labels only for line
- d3v4 checkout chart - making sure the color scheme is correct for the legend and circles
- simple multi line chart with D3
- D3 - Single and Multi Line chart tooltips
- d3js gantt chart with date/time scale at the top and current day blue line
- d3 bar chart with fixed bar width and fixed spacing to align in center axis line
- Incomplete line chart with missing points and missing lines
- Getting the scale right for a line chart for a simple CSV in D3 v4
- Simple D3.js line chart with data that are values collect every hours
- How to create a multi-series line chart with series for each unique item in 1st column?
- NVD3 Line Plus Bar With Focus Chart only displaying half width of first and last bar
- How do you get JSON data and create a line chart with d3.js?
- SVG Legend for multi line chart d3 v6
- D3 Bar Chart with Variable X and Y(variable width and height for bars)
- d3 multi line with mouse over cursor for both y AND x value
- Generating a simple bar chart with d3.js and an array of form data
More Query from same tag
- How filling area with different colors in angular2, d3.js?
- How to find if point is inside polygon in d3.js
- force directed graph change color of all connected node on mouseover
- d3 donut chart with draggable outerRadius
- D3 Max giving error while accessing column wise and header array
- d3.js circles don't show after trying to use the update pattern
- How to add a properly scaled y axis to a stacked d3 bar chart
- Resize function for responsive d3
- Get the element which triggered the event in d3.js
- Distribute objects evenly along a curved path in d3
- Inline SVG with .html extension displays correctly, with .svg extension it doesn't
- d3.js static graph scrolling
- TopoJson makefile ignoring external properties file
- Fix x-axis position in scrollable Heatmap d3
- How to properly use call() in D3 to bind drag behavior?
- .timeFormat(%b %Y) not giving me the right dates
- How to select multiple selectors with selectAll?
- Obtaining totals from properties of parallel arrays in nested objects
- D3 selection html -- index starting at 1 instead of 0 when passing function
- How to display d3js chart inside div of vertical tab content box?
- dc.js Tutorial Line Chart Render
- Customize chart points on c3.js
- custom tooltip on cumulativeLineChart in nvd3
- D3 initial zoom behavior breaks
- how to avoid overlapping circles on a map using d3js
- Fade out sankey links if they are not connected to a node onclick
- Need d3 brush to NOT work on touch devices
- R / d3heatmap - is there a way to rotate the axis label?
- D3.js animation for donut labels
- c3.js Accessing data objects/lines