使用node对图片的像素进行处理

这里使用常见的图片灰度处理为例子:

这里用到一个 canvas 的库,本质上是调用的 c++ ,通过 c++ 调用显卡渲染。

可以做到和前端的 canvas 一样的api处理,但是效果更好。

npm i canvas

  

如果发现报错,以管理员权限打开 cmd

//先运行一下这个命令
npm install --global --production windows-build-tools
//安装的好像是一个python运行环境,中间有一个绿色的框框,结尾是python
//提示+ windows-build-tools@5.2.2
// updated 1 package in 107.732s说明安装成功 //然后运行命令 ,好像是全局安装这个包,英语小白,看不懂
npm install -g node-gyp //最后会提示一堆中文,===创建代码=== === 生成代码===复制啥的===说明安装成功 //然后把已经下载的node-modules文件删除,从新执行命令
npm install canvas //安装依赖就搞定了

  

一个简单的例子:图片灰度处理

const { createCanvas, loadImage } = require('canvas')
const fs = require("fs"); async function main(){
const myimg = await loadImage('./image/b.png');
const canvas = createCanvas(myimg.width, myimg.height)
const ctx = canvas.getContext('2d');
ctx.drawImage(myimg,0,0);
let imgData = ctx.getImageData(0,0,myimg.width, myimg.height);
let data = imgData.data;
for(let i = 0; i < data.length; i++){
var avg=(data[i]+data[i+1]+data[i+2])/3;
//var avg = data[i]* 0.3 + data[i+1]* 0.59 + data[i+2]* 0.11
data[i] = avg;
data[i+1] = avg;
data[i+2] = avg;
}
ctx.putImageData(imgData,0,0);
canvas.createPNGStream().pipe(fs.createWriteStream("./out.png")); } main();

  

详细的 API 操作,可以去看官方的文档,非常详情

nodejs 对 png 图片的像素级别处理的更多相关文章

  1. canvas学习笔记:canvas对图片的像素级处理--ImageData的应用

    学习了canvas的基本绘图功能后,惊喜的发现canvas对图片数据也有相当强大的处理功能,能够从像素级别操作位图,当然[lte ie8]不支持. 主要的函数有三个: ctx.createImageD ...

  2. 用Delphi直接获取bmp图片的像素

    用Delphi直接获取bmp图片的像素,并存储显示出.(此像素主要用在LED上显示).希望高手能给出代码啊!! function getImagePixels(f: string): Integer; ...

  3. iOS图片的伪裁剪(改变图片的像素值)

    0x00 原理 利用一张图片事先画好的图片(以下称为蒙板),盖在要被裁剪的的图片上,然后遍历蒙板上的像素点,修改被裁剪图片对应位置的像素的色值即可得到一些我们想要的不规则图片了(比如人脸) 0x01 ...

  4. win32加载图片获得像素值

    在写光栅渲染器时,需要加载图片获得像素以便进行纹理插值,试了几种方法发现下面这种比价简单,效率也可以接受 Texture2D是我自己定义的类,其中m_pixelBuffer是一个动态二维数组,每个元素 ...

  5. 精确选择识别png图片有像素的区域(使用方法)

    /** * * *---------------------------------------* * | ***精确选择识别png图片有像素的区域*** | * *----------------- ...

  6. 精确选择识别png图片有像素的区域

    /** * * *---------------------------------------* * | ***精确选择识别png图片有像素的区域*** | * *----------------- ...

  7. div里嵌套了img底部会有白块问题和图片一像素问题解决

    div里嵌套了img底部会有白块 因为img默认是按基线(baseline)对齐的.对比一下图片和右边的p, q, y等字母,你会发现这三个字母的“小尾巴”和图片下方的空白一样高.下面这张图中的黑线就 ...

  8. 验证码识别之w3cschool字符图片验证码(easy级别)

    起因: 最近在练习解析验证码,看到了这个网站的验证码比较简单,于是就拿来解析一下攒攒经验值,并无任何冒犯之意... 验证码所在网页: https://www.w3cschool.cn/checkmph ...

  9. iOS关于图片点到像素转换之杂谈

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 不管是以什么方法生成的图片,是从磁盘上读取的,还是从其他对象中 ...

随机推荐

  1. lucene反向索引——倒排表无论是文档号及词频,还是位置信息,都是以跳跃表的结构存在的

    转自:http://www.cnblogs.com/forfuture1978/archive/2010/02/02/1661436.html 4.2. 反向信息 反向信息是索引文件的核心,也即反向索 ...

  2. Poseidon 系统是一个日志搜索平台——认证看链接ppt,本质是索引的倒排列表和原始日志数据都存在HDFS,而文档和倒排的元数据都在NOSQL里,同时针对单个filed都使用了独立索引,使用MR来索引和搜索

    Poseidon 系统是一个日志搜索平台,可以在百万亿条.100PB 大小的日志数据中快速分析和检索.360 公司是一个安全公司,在追踪 APT(高级持续威胁)事件,经常需要在海量的历史日志数据中检索 ...

  3. O缺缺缺缺氧 O缺缺氧

    2019 1.18 优雅的退出/关闭/重启gunicorn进程 Ubuntu查看端口占用情况 微信小程序解决 加载图片出现渲染层网络层错误 更改Ubuntu默认python版本的方法 JS/HTML格 ...

  4. python 设计模式之解释器(Interpreter)模式

    #写在前面 关于解释器模式,我在网上转了两三圈,心中有了那么一点概念 ,也不知道自己理解的是对还是错. 其实关于每一种设计模式,我总想找出一个答案,那就是为什么要用这种设计模式, 如果不用会怎么样,会 ...

  5. ISO/IEC 9899:2011 条款6.4.2——标识符

    6.4.2 标识符 6.4.2.1 通用 语法 1.identifier: identifier-nodigit identifier    identifier-nondigit identifie ...

  6. 机器学习 - 算法 - Xgboost 数学原理推导

    工作原理 基于集成算法的多个树累加, 可以理解为是弱分类器的提升模型 公式表达 基本公式 目标函数 目标函数这里加入了损失函数计算 这里的公式是用的均方误差方式来计算 最优函数解 要对所有的样本的损失 ...

  7. 简单模拟 Promise

    class promise { constructor(fn) { this.data = null; this.err = null; this.isPromise = false; this.er ...

  8. mybatis/tk mybatis下实体字段是关键字/保留字,执行报错

    实体如下: import com.fasterxml.jackson.annotation.JsonFormat; import com.xxx.web.bean.PagesStatic; impor ...

  9. PostgreSQL学习笔记——窗口函数

    在学习窗口函数之前,我们新建一个Product表并往其中插入一些数据: drop table if exists Product; create table Product ( product_id ...

  10. Java基础教程:IDEA单元测试

    Java基础教程:IDEA单元测试 环境配置 使用idea IDE 进行单元测试,首先需要安装JUnit 插件. 安装JUnit插件步骤 File-->settings-->Plguins ...