I am collecting incoming data from user with x and y coordinates and some score point in addition . Now I want to display that data in svg line . Data from user contain all positive and negative values . So I want to plot line in coordinate plane like line can be in any shape . for eg - as we move cursor on screen draw svg curved line.
How can I implement this?
You could use functionality from d3.js. https://d3js.org/
It makes it possible to provide an array of x,y coordinates and generate a valid svg path from it, that can be then be used for visualisation.
https://github.com/d3/d3-shape/blob/v3.1.0/README.md#lines
Example: https://observablehq.com/@d3/d3-line It also provides options for interpolations, like Bezier
If you need more control over your visualisation, you could use the path generator.
https://github.com/d3/d3-path/blob/v3.0.1/README.md#path
Example: https://observablehq.com/@d3/d3-path
