score:2
Accepted answer
In the brushed()
and zoomed()
functions, you are only updating the green line (extra VS. date). You have to identify each line (for example with a specific class), and update both using their respective d3.line
functions:
Line_chart.append("path")
.datum(data)
.attr("class", "line line-extra") // <-- class added here
.style("stroke", "green")
.attr("d", line);
Line_chart.append("path")
.datum(data)
.attr("class", "line line-speed") // <-- and here
.style("stroke", "blue")
.attr("d", line1);
[...]
function updateLines() {
Line_chart.select(".line-extra").attr("d", line);
Line_chart.select(".line-speed").attr("d", line1);
}
function brushed() {
[...]
updateLines();
}
function zoomed() {
[...]
updateLines();
}
Source: stackoverflow.com
Related Query
- brush in multiline chart is working for only one line
- D3 only one Y-axis on right for plotting line chart
- C3js - combination chart with data labels only for line
- Animation is not working for multiline chart D3 v4
- dimple - make line dotted for only part of the chart
- d3.js Stacked Bar Chart working for one dataset but not the other
- d3-tip not working for a line chart
- Animation is not working for d3 line chart
- why Only one line is getting extended while using brushed() in interactive multiseries line chart
- 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?
- d3js timeline chart - with one rectangle block for a scrub
- D3 force layout: Straight line instead of curve for links (but only for some links)
- d3 v4 line chart transition not working
- D3: How to use exit().remove() for Multi-Series Line Chart
- Error in A Simple D3 Line chart with Legend and Tooltips for D3v 3.5.13
- How can I create a doughnut chart with rounded edges only on one end of each segment?
- d3 show labels only for ticks with data in a bar chart
- d3.v4.js Line Graph Interactive Legend - Only works for first line
- How do I create a multiline chart using d3js with json formatted for nvd3?
- D3.js Error: Invalid value for <path> attribute for a line chart
- How to highlight only one datapoint in c3.js line graph?
- Multiple line chart not working with date format
- Looking for a way to display labels on sunburst chart (could not find a working example)
- Getting the scale right for a line chart for a simple CSV in D3 v4
- Exit() is not working for d3 group bar chart
- How to create a multi-series line chart with series for each unique item in 1st column?
- how to display data from 1st point on words on y axis for line chart in d3.js
- cs.js - displaying only one line at the same time (in multi-line chart)?
- D3 mouseover effect for each chart on one page
- NVD3 Line Plus Bar With Focus Chart only displaying half width of first and last bar
More Query from same tag
- How to display custom tooltips on line chart using Rickshaw Library
- Add a Circle for Every nth Data Element d3.js
- nvd3 - multiBarChart: how to log scale y axis
- NVD3 Chart responsive issue
- D3: Collision/overlap detection of circles in a generated view
- How to add background shading to D3 line chart
- Create infinite parallel pattern
- I am not able to add put labels in 3d donut chart using d3.js
- D3 Tooltip for updated pie chart
- How to link to d3.js-v3 source file without getting code 301/304 or TypeError
- Why don't the circles show up?
- nvd3 multibar chart: toggle default values to show
- How to use a value in d3 data key function?
- I have an image that has a hover effect, but there is a text above and it avoids it
- dynamic svg path in d3.js
- $watch in directives and activate directive on click
- How to use nest and rollup functions in D3 to create a bar chart
- Issues in converting StackBar chart from D3.js version 3 to version 4
- Issue with responsive d3 graph
- D3 v4: Update force layout
- Building a binary state chart in billboard.js for multiple pieces of equipment
- How do I append DOM to an Angular 2 component and still get encapsulated styles
- The mouseover event for D3.js does not work in Leaflet
- How does d3.js decides how many and which ticks to show?
- How to use D3 Graph(d3.v3.min.js) with parameters in Ext JS 5 MVVM?
- Grouping data for d3 pie chart
- Error while calling d3-tip "tip.show" from inside a function
- D3 rendering stacked bars
- Programmatically opening d3.js v4 collapsible tree nodes?
- How to avoid bars in bar graph getting overlapped with legend