节点JS画布图像数据 [英] Node JS canvas image data

问题描述

我正在尝试读取图像，并且当您使用HTML画布 Uint8ClampedArray时，我想要获得的结果是相同的吗？ var imageData = ctx.getImageData（0，0，width，height）; 我找到了一个N​​PM库画布，但是我无法安装它。

I am trying to read a image and the result i want to get is the same when you use a HTML canvas "Uint8ClampedArray"? var imageData = ctx.getImageData(0, 0, width, height); I found a NPM lib canvas but i cant get it to install.

那么还有一种不使用Canvas的方法吗？

So is there a another way to go without using Canvas?

推荐答案

要严格回答以下问题：

那么还有一种不使用Canvas的方法吗？

So is there a another way to go without using Canvas?

问题是，即使我们可以加载二进制图像数据，我们需要能够解析其二进制格式以将其表示为原始像素数据（ ImageData / Uint8Array 对象）。

The issue is that, even if we can load an image binary data, we need to be able to parse its binary format to represent it as raw pixel data (ImageData/Uint8Array objects).

这就是为什么画布模块在安装时需要进行编译：它依赖并链接到 libpng ， libjpeg 和其他n

This is why the canvas module needs to be compiled when installed: it rely on and links to libpng, libjpeg and other native libraries.

要加载表示文件中像素原始数据的 Uint8Array ，而无需画布（或本机库包装器） ），将要求解码器仅以Javascript运行。

To load a Uint8Array representing pixel raw data from a file, without canvas (or native library wrapper), will requires decoders running only in Javascript.

例如存在作为第三方库的png和jpeg解码器。

For e.g. there exist decoders for png and jpeg as third-party libraries.

使用 png.js ：

const PNG = require('png-js');
PNG.decode('./image.png', function(pixels) {
   // Pixels is a 1d array (in rgba order) of decoded pixel data
});

解码JPEG

使用喷墨：

const inkjet = require('inkjet');
inkjet.decode(fs.readFileSync('./image.jpg'), function(err, decoded) {
  // decoded: { width: number, height: number, data: Uint8Array }
});

https://github.com/gchudnov/inkjet

这篇关于节点JS画布图像数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！