ppu-ocv/canvas-io.js

A type-safe, modular, chainable image processing library built on top of OpenCV.js with a fluent API leveraging pipeline processing.

import{getPlatform,isCanvasLike}from"./canvas-factory.js";export async function bufferToCanvas(file){if(isCanvasLike(file))return file;return getPlatform().loadImage(file)}export async function canvasToBuffer(canvas){if(canvas instanceof ArrayBuffer)return canvas;if(typeof canvas.toBuffer==="function"){let buffer=canvas.toBuffer("image/png");let arrayBuffer=new ArrayBuffer(buffer.byteLength);new Uint8Array(arrayBuffer).set(new Uint8Array(buffer));return arrayBuffer}let toBlob=canvas.toBlob;if(typeof toBlob==="function"){let blob=await new Promise((resolve,reject)=>{toBlob.call(canvas,(b)=>b?resolve(b):reject(new Error("toBlob returned null")),"image/png")});return blob.arrayBuffer()}if(typeof canvas.convertToBlob==="function"){let blob=await canvas.convertToBlob({type:"image/png"});return blob.arrayBuffer()}if(typeof canvas.toDataURL==="function"){let dataURL=canvas.toDataURL("image/png");let base64Data=dataURL.replace(/^data:image\/png;base64,/,"");let binaryString=atob(base64Data);let arrayBuffer=new ArrayBuffer(binaryString.length);let bytes=new Uint8Array(arrayBuffer);for(let i=0;i<binaryString.length;i++){bytes[i]=binaryString.charCodeAt(i)}return arrayBuffer}let ctx=canvas.getContext("2d");let imageData=ctx.getImageData(0,0,canvas.width,canvas.height);let canvasBuffer=new ArrayBuffer(imageData.data.byteLength);new Uint8Array(canvasBuffer).set(new Uint8Array(imageData.data.buffer,imageData.data.byteOffset,imageData.data.byteLength));return canvasBuffer}