Merge pull request #66 from Ritika8081/web-worker

Code Updates to Resolve Issues

README.md

@@ -46,6 +46,9 @@ Chords is an application based on Web Serial connection, you can connect [Compat
 
 - [Vendors](src/components/vendors.ts) list for board name and there vendor id are taken from [Stackblitz](https://stackblitz.com/edit/typescript-web-serial?file=vendors.ts) created by [William Grasel](https://github.com/willgm)
 
+## Icons Used
+- [Lucide React](https://lucide.dev/guide/packages/lucide-react)
+
 ## Roadmap for upcoming update
 
 - [X] **Data Filtering** : We will be adding bio-potential signal filtering options which includes 50/60 Hz notch filter to remove AC interference noise and highpass/lowpass remove artefacts from ECG, Emg ,Eog and EEg. Under filters, we will be adding different highpass and lowpass filters for specific bio-potential signals this feature will further enhance the user experience to record even more clear biopotential signals.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "chords",
-  "version": "2.3.2a",
+  "version": "2.3.3a",
   "private": true,
   "type": "module",
   "scripts": {

src/components/Canvas.tsx

@@ -71,7 +71,7 @@ const Canvas = forwardRef(
 
 
   useEffect(() => {
-    numXRef.current= (getpoints(selectedBits) * currentValue)+1;
+    numXRef.current= (getpoints(selectedBits) * currentValue);
 
   }, [ currentValue]);
 
@@ -310,7 +310,7 @@ const Canvas = forwardRef(
           line.setY(currentSweepPos.current[i] % line.numPoints, data[i + 1]);
 
           // Clear the next point to create a gap (optional, for visual effect)
-          const clearPosition = (currentSweepPos.current[i] + (numXRef.current / 100)) % line.numPoints;
+          const clearPosition = Math.ceil((currentSweepPos.current[i] + (numXRef.current / 100)) % line.numPoints);
           line.setY(clearPosition, NaN);
 
           // Increment the sweep position for the current line
@@ -382,18 +382,6 @@ const Canvas = forwardRef(
 
     }, [animate]);
 
-    useEffect(() => {
-      const handleResize = () => {
-        createCanvases();
-      };
-
-      window.addEventListener("resize", handleResize);
-
-      return () => {
-        window.removeEventListener("resize", handleResize);
-      };
-    }, [createCanvases,]);
-
     return (
       <main className=" flex flex-col flex-[1_1_0%] min-h-80 bg-highlight  rounded-2xl m-4 relative"
         ref={canvasContainerRef}