score:0
Based on some editing of your fiddle, it seems that they ARE actually being displayed... but they're out of range of the canvas. If you look at the outcome here, you can see that the newly added point near the top is displayed, on all of the graphs.
I'll see if I can work on a proper fix, because obviously this is not the desired behaviour.
UPDATE
It looks like the problem is that you aren't updating your domain when you display your dots, so they are using the last domain which was set (hence why only last show normally). In addition, you are displaying dots for the entire data set on each graph (although most of them are outside the domain).
I would actually recommend trying to parse your data into an array for each unique symbol, it make things much more straightforward for you. For example, you could simply set the domain using d3.extent
.
SUMMARY
A couple of solutions spring to mind:
Setting up separate axes/domains per graph.
Putting your dots into a g element per symbol, then adding data to them via a nested selection.
This works, but you really should read up a bit more on (nested) selections. Ideally, you would probably want to separately generate each graph, out of scope of the others. This solution is badly designed, but hopefully it should help to give you an idea of how your code is working.
Source: stackoverflow.com
Related Query
- D3 adding dots to multiple stacked line charts
- Stacked line charts or streamgraphs in Raphael?
- How to create Stacked Line Chart D3, Multiple Y Axis and common X Axis
- D3 js multiple line graph toggle dots on/off
- Multiple multi-series d3 line charts on one page
- Adding legends to d3.js line charts
- Adding color dynamically to a multiple line chart but it is not working in d3.js
- plot dots on multiple lines in line chart
- D3: Zoom with multiple line charts somehow combines their data arrays
- Same X-axis Multiple Line Charts using d3
- D3 - How to create multiple line charts from an array of objects
- Mouseover Line on multiple charts when hover on single chart using D3
- D3 toggle stacked to grouped on multiple bar charts
- d3js Multiple Stacked Bar Chart Line Cursor Appearing in Wrong Chart
- Multiple connected one line charts with angular-nvd3
- NVD3 - Adding and resizing multiple vertical lines to stacked area chart
- D3.js: Multiple line charts mouseover with same x (time) showing different y (price)
- d3 js linear scale bar position and height in stacked to multiple charts
- Display multiple d3.js charts in a single html page
- D3.js - Donut charts with multiple rings
- Nvd3.js - Adding multiple y-axis to cumulative chart
- d3-tooltips for multiple linked dc.js charts
- nvd3.js tooltip position with multiple charts
- dc.js add class to data points in multiple charts based on criteria from first chart
- Adding a horizontal line to d3 graph displays at the wrong value
- How to draw logarithmic line charts with nvd3
- C3.js SVG visualization to Canvas with canvg - Line charts filled with black rectangles , "ERROR: Element 'parsererror' not yet implemented"
- Loading multiple CSV in DC.js, adding a value, and concatenating the results into a single dataTable
- SVG: adding shadow filter makes straight line invisible
- D3 - adding grid to simple line chart
More Query from same tag
- How to format number in D3.js /C3.js
- d3 Force: Calculating position of text on links where links between nodes are arcs
- Dc.js: Bar-chart, bars are overlapping
- Bundle layout using d3.js and given json file structure
- WSO2 DAS Dashboard - Creating custom gadget
- D3 and SVG namespaces for custom svg elements or attributes to be valid?
- Convert Curve path to straight path using jquery with animation
- d3 version 4 circle pack passing in data
- Parsing dates in JSON in d3/observablehq
- D3js, uncaught reference error when selecting rect in selectAll('rect')
- Cubism - Display of values in axis
- How to refresh D3 tree, even though data has not changed?
- D3.js bar chart animation not exiting correctly
- Animation is smooth in Chrome, but not in Firefox
- Getting point mouse interaction and brushes to work together
- Set opacity of circles based on the occurrences in the parent element (Group) - D3.js
- cant render links for d3 radial tree
- How do you allow d3js plot to run off screen
- D3 plus wrapping text in circles
- set maximum value for c3js scatter chart plot size
- How to get different shades of colors for a single color?
- Error parsing d3 line chart JSON data
- How to add another axis in a parallel coordinate plot in d3
- show text with diagonal line in d3 tree graph
- How do your write a function that returns values from an array?
- Images packing algorithm in javascript
- How to override inherited svg style
- How to use d3.js colorScale to change color based on string values rather than numeric values?
- d3 parsing and drawing nested csv data
- Manually selecting a feature in a map generated by d3.js (for the purposes of zooming in this case)