Skip to content

Repository files navigation

Image for Node.js

This is a part of Node3D project.

NPMLintTestCpplint

npm install @node-3d/image

Using FreeImageRe through @node-3d/deps-freeimage, this addon loads images from:

  • Local file.
  • Data URI.
  • Http(s) URL.
  • Node.js Blob URL.
  • Raw RGBA pixel data.

The Image class is similar to HTMLImageElement, and can be used as a replacement in non-DOM environments.

The @node-3d/deps-freeimage dependency entrypoint preserves the Windows PATH setup behavior that older deps-freeimage-raub consumers relied on through addon-tools getPaths(). A normal npm install or npm ci should run dependency install scripts in order, so consumers should not need manual FreeImage setup in CI.

Additional features:

  • save - saves the image to a local file.
  • drawImage - is similar to drawImage.

Note: this addon uses N-API, and therefore is ABI-compatible across different Node.js versions. Addon binaries are precompiled and there is no compilation step during the npm install command.

Image

import{Image}from'@node-3d/image';constimage=newImage('images/test.png');// relative to CWDimage.on('load',()=>{console.log('data',image.width,image.height,image.data);});

For loaded images, image.data will contain a Buffer of 4 * width * height bytes. You can directly interact with that buffer - read or write, and then save the image to a file or use it any other way.

With Image.fromPixels() it is possible to generate new images from scratch by providing your own data buffer.

Set window icon

Compatible with @node-3d/glfwwindow.icon property.

consticon=newImage();icon.src='icons/logo.png';icon.on('load',()=>{window.icon=icon;});

Load an OpenGL texture

Here Image is used to load a texture. The constructed object receives src property, then the file is read and 'load' event is emitted. After that, image.data is available as a Buffer, containing the whole pixel data, and image.width/image.height contain the dimensions.

import{Image}from'@node-3d/image';constimage=newImage();// Web-style onloadimage.onload=()=>{gl.bindTexture(gl.TEXTURE_2D,texture);gl.texImage2D(gl.TEXTURE_2D,0,gl.RGBA,gl.RGBA,gl.UNSIGNED_BYTE,image);gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_MAG_FILTER,gl.LINEAR);gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_MIN_FILTER,gl.LINEAR_MIPMAP_NEAREST);gl.generateMipmap(gl.TEXTURE_2D);gl.bindTexture(gl.TEXTURE_2D,null);};image.src='textures/grass.jpg';

Make an OpenGL snapshot

Image can save its current content to the filesystem. It can also load from raw pixel values using static fromPixels() method.

constmemSize=screen.w*screen.h*4;// estimated number of bytesconststorage={data: Buffer.allocUnsafeSlow(memSize)};gl.readPixels(0,0,screen.w,screen.h,gl.RGBA,gl.UNSIGNED_BYTE,storage);constimg=Image.fromPixels(screen.w,screen.h,32,storage.data);img.save(`${Date.now()}.jpg`);

Binary Origin

Release archives are built by this repository's public GitHub Actions workflows.

Attestations: https://github.com/node-3d/image/attestations

To verify a downloaded archive:

gh release download <tag> -R node-3d/image -p <platform>.gz
gh attestation verify <platform>.gz -R node-3d/image

Release packaging should avoid re-archiving previously downloaded release archives into new build artifacts. Clean stale downloaded *.gz files before producing platform archives.

Releases

Used by

Contributors

Languages