@thi.ng/pixel/canvas.js

Typedarray integer & float pixel buffers w/ customizable formats, blitting, drawing, convolution

import { canvas2d } from "@thi.ng/canvas";
import { isNumber } from "@thi.ng/checks/is-number";
function canvasPixels(width, height, parent, opts) {
  let canvas;
  let ctx;
  if (isNumber(width)) {
    const c = canvas2d(width, height, parent, opts);
    canvas = c.canvas;
    ctx = c.ctx;
  } else {
    canvas = width;
    ctx = canvas.getContext("2d");
  }
  if (parent && canvas instanceof HTMLCanvasElement)
    parent.appendChild(canvas);
  const img = ctx.getImageData(0, 0, canvas.width, canvas.height);
  const data = new Uint32Array(img.data.buffer);
  return {
    canvas,
    ctx,
    img,
    data
  };
}
const canvasFromPixelBuffer = (buf, parent, opts) => {
  const { canvas } = canvas2d(buf.width, buf.height, parent, opts);
  buf.blitCanvas(canvas);
  return canvas;
};
export {
  canvasFromPixelBuffer,
  canvasPixels
};