-
|
When displaying some data in an area chart, the line swirls and loop over itself. See attached video when selecting the YTD filter. Screen.Recording.2025-09-10.at.19.31.54.movHere's the underlying data for the chart I used the Area Chart - Interactive form the documentation as a starting point. The only thing I changed is basically the data and the colors. |
Beta Was this translation helpful? Give feedback.
Answered by
regg00
Sep 11, 2025
Replies: 1 comment
-
|
Well after a couple of hours of troubleshooting and some help from ChatGPT, the fix was to change the I'm not entirely sure why, but me graph is now ok. So, based on the original example from the website, here's that needs to be change to fix the issue of overlapping lines:
Here's the "fixed" code based on the example: |
Beta Was this translation helpful? Give feedback.
0 replies
Answer selected by
regg00
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Well after a couple of hours of troubleshooting and some help from ChatGPT, the fix was to change the
curvevalue tocurveMonotoneXinstead ofcurveNaturalfrom thed3-shapelibrary.I'm not entirely sure why, but me graph is now ok.
So, based on the original example from the website, here's that needs to be change to fix the issue of overlapping lines:
import { curveNatural } from "d3-shape";should be replaced toimport { curveMonotoneX } from 'd3-shape';areaitem of the chart props, replacecurveNaturaltocurveMonotoneXHere's the "fixed" code based on the example: