JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas" width="1000" height="600"></canvas>

JavaScript

var curves = [];
			var curX = 0;
			for (var j = 0; j < 3; j++) {
			    x = [];
			    for (var i = 0; i < 100; i++) {
			        x.push(i * 10);
			        x.push(100 - Math.floor(Math.random() * 100));
			    }
			    console.log(x);
			    curves.push(x);
			}
			var colors = ["red", "blue", "green"];
			var canvas = document.getElementById('canvas');
			var ctx = canvas.getContext('2d');
			// console.log(ctx);
			var tension = 1;
			for (var i = 0; i < curves.length; i++) {
			    ctx.stroke();
			    ctx.strokeStyle = colors[i];
			    console.log(colors[i]);
			    drawCurve(ctx, curves[i]);
			}

			// var inter = setInterval(moveCurve, 20);


			function drawCurve(ctx, ptsa, tension, isClosed, numOfSegments, showPoints) {

			    showPoints = showPoints ? showPoints : false;
			    showPoints = true;
			    // ctx.stroke();
			    ctx.beginPath();

			    drawLines(ctx, getCurvePoints(ptsa, tension, isClosed, numOfSegments));
			    // drawLines(ctx, ptsa);

			    // if (showPoints) {
			    //     ctx.stroke();
			    //     // ctx.beginPath();
			    //     for(var i=0;i<ptsa.length-1;i+=2) 
			    //             ctx.rect(ptsa[i] - 2, ptsa[i+1] - 2, 4, 4);
			    // }
			}

			function getCurvePoints(pts, tension, isClosed, numOfSegments) {

			    // use input value if provided, or use a default value   
			    tension = (typeof tension != 'undefined') ? tension : 0.5;
			    isClosed = isClosed ? isClosed : false;
			    numOfSegments = numOfSegments ? numOfSegments : 16;

			    var _pts = [],
			        res = [], // clone array
			        x, y, // our x,y coords
			        t1x, t2x, t1y, t2y, // tension vectors
			        c1, c2, c3, c4, // cardinal points
			        st, t, i; // steps based on num. of segments

			    // clone array so we don't change the original
			    _pts = pts.slice(0);

			    // The algorithm require a previous and next point to the actual point array.
			    // Check if we will draw closed or open curve.
			    // If...