The problem is just the first line in this selection:
var circle = svg.selectAll("circle") .data(aNumCircles) .enter() .append("circle") //etc...
Since there are already circles in the SVG at the second time
addpoints() runs, your "enter" selection will be empty.
Instead of that, it should be:
var circle = svg.selectAll(null) .data(aNumCircles) .enter() .append("circle") //etc...
selectAll(null) you can be completely sure that your "enter" selection has all the elements in your data array.
Here is the updated plunker: https://plnkr.co/edit/3u0er01thuj5P8e0XqO6?p=preview
- Simple circle animation is only displayed the first time
- D3 transition from stacked bar to bar chart only works the first time
- Why is scale only working the first time I doubleclick?
- D3 donut chart function only works the first time it's called
- How to have d3 tickFormat of (day, time) but only show time if day is the same?
- Create a padding for the first and last data points using a time scale
- SVG -> getBBox fails but only half the time
- How can I change the color of a circle created via d3 each time I click the mouse?
- cs.js - displaying only one line at the same time (in multi-line chart)?
- d3.js circle plotting does not working properly while trying to load after first time
- D3 v4 moving both circle and text at the same time
- How can I make the animation of a circle continous with hovering like this gif in d3.js?
- on click event D3.js only works first time
- Nodes of a radial force layout only take up a quarter of the circle
- Repeat the animation only a given number of times
- d3.js bubble chart, mousover and mouseout events only working first time
- How to start D3 JS Tree to render in Collapsible Mode when loaded for the first time
- Why does D3's focus on an input work only the first time?
- d3.js - Tooltips only shows the first properties values of the data object
- d3.js data not bound the first time
- D3,js on mouse event CLICK appending only the first image from data set
- Can't get 4 circle to appear at the same time
- d3.js: Is a time scale appropriate for the x-axis when only wanting to compare HH:MM?
- d3.js on click doesn't work for the first time
- Function generating HTML table does not create <td> elements the first time
- D3 time range drops the first month
- Pie Chart does not update after first click? onClick works only for first time
- How can I bring a circle to the front with d3?
- D3: Is it possible to zoom+pan one axis and only pan the other?
- MultiBar chart with nvd3 / d3 only shows labels for every other tick on the x-axis. How can I get them all to show up?
More Query from same tag
- Return multiple values from a crossfilter dimension for a pie chart
- Changing attribute of a DOM element using D3 data that is bound to it
- more minimaler cubism.js horizon chart from json example
- ES6 export of a script
- D3.js collapsible tree - expand/collapse intermediate nodes
- d3 multiple donut chart slice label not presented
- If statement for D3
- dc.js Series Chart multi line
- Need Help in D3 Sankey Chart
- Using NVD3 on top of D3. Not understanding how to include the 'assets' properly
- D3 V5 Tree link source position is incorrect
- d3js wrong or no text in x-axis
- d3 returns error `e is not a function` while passing nest data to d3.stack
- remove or skip null values in d3js stacked bar chart
- Is there a correct way to spot non-fatal errors in js?
- .on("drag", function()) and .on("contextmenu", function()) does not work when used on the same code
- D3.js - Error : d3.line() is not a function (changed from version 4 to 3)
- Error: <tspan> attribute dy: Expected length, "NaN" - Raphael.js
- Apply Filter function to select multiple rows of a CSV in D3.js
- Bezier curve with mouse event
- Updating and Transitioning Individual SVG Elements Within a Group in D3.js
- How to display D3 Color legend horizontally and not vertically
- Increasing font size in C3 charts without cutting off the text
- d3js force-directed graph draws nodes but no links
- D3 dynamically vertically align text
- d3.js choropleth map --How do I map more than one property from CSV to JSON, so I can use it in a tooltip?
- Replace the decimal dot with a comma on an axis in D3?
- How do I zoom/pan on enlarged canvas using d3?
- Cannot add capitals to geojson world map