NodeJS实现图片文本分割
程序员文章站
2022-06-25 21:38:07
本文实例为大家分享了nodejs实现图片文本分割的具体代码,供大家参考,具体内容如下var fs = require('fs');var jpeg = require('jpeg-js') func...
本文实例为大家分享了nodejs实现图片文本分割的具体代码,供大家参考,具体内容如下
var fs = require('fs'); var jpeg = require('jpeg-js') function getsumrgb(data, i) { var cr = data.data[i+0] var cg = data.data[i+1] var cb = data.data[i+2] var srgb = (cr+cg+cb) return srgb } function gettoprgb(data, i) { var topindex = (data.width * 4 * -1) i= i + topindex; var cr = data.data[i+0] var cg = data.data[i+1] var cb = data.data[i+2] return [cr,cg,cb] } function getheightrgb(data, i, havergb) { var width = data.width var height = data.height var len = width * height * 4 var havenum = 0 for(i=i;i<len;i+=width*4) { if(getsumrgb(data, i) == havergb) { havenum++ } } return havenum } function clearbackground(data) { var width = data.width var height = data.height var len = width * height * 4 var i, tmp for(i=0;i<len;i+=4) { tmp = getsumrgb(data, i) if(tmp > 120*3) { data.data[i+0]=255 data.data[i+1]=255 data.data[i+2]=255 } } for(i=0;i<len;i+=4) { tmp = getsumrgb(data, i) if(tmp <= 32*3) { tmp = gettoprgb(data, i) data.data[i+0]=tmp[0] data.data[i+1]=tmp[1] data.data[i+2]=tmp[2] } } for(i=0;i<len;i+=4) { tmp = getsumrgb(data, i) if(tmp !=255*3) { data.data[i+0]=0 data.data[i+1]=0 data.data[i+2]=0 } } var maxwidth = width * 4 var arrlist = [] arrlist[0]=[] arrlist[1]=[] arrlist[2]=[] arrlist[3]=[] arrnum = 0 block = 0 for(i=0;i<maxwidth;i+=4) { tmp= getheightrgb(data, i, 0) if(tmp==0) { if(block != 0) { arrlist[arrnum] = [block/4,i/4] block=0 arrnum++ } } else if(tmp >0 ) { if(block == 0) { block = i } } } console.log(arrlist) return data } var picname = "tmp.jpg" var newpicname= "000.jpg" var jpegdata = fs.readfilesync(picname) var rawimagedata = jpeg.decode(jpegdata, {usetarray: true}) rawimagedata = clearbackground(rawimagedata) var jpegimagedata = jpeg.encode(rawimagedata,100) fs.writefilesync(newpicname, jpegimagedata.data)
再为大家分享js实现图片切割的方法:
//图片切割 var imgcropper = class.create(); imgcropper.prototype = { //容器对象,控制层,图片地址 initialize: function(container, handle, url, options) { this._container = $(container);//容器对象 this._layhandle = $(handle);//控制层 this.url = url;//图片地址 this._laybase = this._container.appendchild(document.createelement("img"));//底层 this._laycropper = this._container.appendchild(document.createelement("img"));//切割层 this._laycropper.onload = bind(this, this.setpos); //用来设置大小 this._tempimg = document.createelement("img"); this._tempimg.onload = bind(this, this.setsize); this.setoptions(options); this.opacity = math.round(this.options.opacity); this.color = this.options.color; this.scale = !!this.options.scale; this.ratio = math.max(this.options.ratio, 0); this.width = math.round(this.options.width); this.height = math.round(this.options.height); //设置预览对象 var opreview = $(this.options.preview);//预览对象 if(opreview){ opreview.style.position = "relative"; opreview.style.overflow = "hidden"; this.viewwidth = math.round(this.options.viewwidth); this.viewheight = math.round(this.options.viewheight); //预览图片对象 this._view = opreview.appendchild(document.createelement("img")); this._view.style.position = "absolute"; this._view.onload = bind(this, this.setpreview); } //设置拖放 this._drag = new drag(this._layhandle, { limit: true, onmove: bind(this, this.setpos), transparent: true }); //设置缩放 this.resize = !!this.options.resize; if(this.resize){ var op = this.options, _resize = new resize(this._layhandle, { max: true, onresize: bind(this, this.setpos) }); //设置缩放触发对象 op.rightdown && (_resize.set(op.rightdown, "right-down")); op.leftdown && (_resize.set(op.leftdown, "left-down")); op.rightup && (_resize.set(op.rightup, "right-up")); op.leftup && (_resize.set(op.leftup, "left-up")); op.right && (_resize.set(op.right, "right")); op.left && (_resize.set(op.left, "left")); op.down && (_resize.set(op.down, "down")); op.up && (_resize.set(op.up, "up")); //最小范围限制 this.min = !!this.options.min; this.minwidth = math.round(this.options.minwidth); this.minheight = math.round(this.options.minheight); //设置缩放对象 this._resize = _resize; } //设置样式 this._container.style.position = "relative"; this._container.style.overflow = "hidden"; this._layhandle.style.zindex = 200; this._laycropper.style.zindex = 100; this._laybase.style.position = this._laycropper.style.position = "absolute"; this._laybase.style.top = this._laybase.style.left = this._laycropper.style.top = this._laycropper.style.left = 0;//对齐 //初始化设置 this.init(); }, //设置默认属性 setoptions: function(options) { this.options = {//默认值 opacity: 50,//透明度(0到100) color: "",//背景色 width: 0,//图片高度 height: 0,//图片高度 //缩放触发对象 resize: false,//是否设置缩放 right: "",//右边缩放对象 left: "",//左边缩放对象 up: "",//上边缩放对象 down: "",//下边缩放对象 rightdown: "",//右下缩放对象 leftdown: "",//左下缩放对象 rightup: "",//右上缩放对象 leftup: "",//左上缩放对象 min: false,//是否最小宽高限制(为true时下面min参数有用) minwidth: 50,//最小宽度 minheight: 50,//最小高度 scale: false,//是否按比例缩放 ratio: 0,//缩放比例(宽/高) //预览对象设置 preview: "",//预览对象 viewwidth: 0,//预览宽度 viewheight: 0//预览高度 }; extend(this.options, options || {}); }, //初始化对象 init: function() { //设置背景色 this.color && (this._container.style.backgroundcolor = this.color); //设置图片 this._tempimg.src = this._laybase.src = this._laycropper.src = this.url; //设置透明 if(isie){ this._laybase.style.filter = "alpha(opacity:" + this.opacity + ")"; } else { this._laybase.style.opacity = this.opacity / 100; } //设置预览对象 this._view && (this._view.src = this.url); //设置缩放 if(this.resize){ with(this._resize){ scale = this.scale; ratio = this.ratio; min = this.min; minwidth = this.minwidth; minheight = this.minheight; } } }, //设置切割样式 setpos: function() { //ie6渲染bug if(isie6){ with(this._layhandle.style){ zoom = .9; zoom = 1; }; }; //获取位置参数 var p = this.getpos(); //按拖放对象的参数进行切割 this._laycropper.style.clip = "rect(" + p.top + "px " + (p.left + p.width) + "px " + (p.top + p.height) + "px " + p.left + "px)"; //设置预览 this.setpreview(); }, //设置预览效果 setpreview: function() { if(this._view){ //预览显示的宽和高 var p = this.getpos(), s = this.getsize(p.width, p.height, this.viewwidth, this.viewheight), scale = s.height / p.height; //按比例设置参数 var pheight = this._laybase.height * scale, pwidth = this._laybase.width * scale, ptop = p.top * scale, pleft = p.left * scale; //设置预览对象 with(this._view.style){ //设置样式 width = pwidth + "px"; height = pheight + "px"; top = - ptop + "px "; left = - pleft + "px"; //切割预览图 clip = "rect(" + ptop + "px " + (pleft + s.width) + "px " + (ptop + s.height) + "px " + pleft + "px)"; } } }, //设置图片大小 setsize: function() { var s = this.getsize(this._tempimg.width, this._tempimg.height, this.width, this.height); //设置底图和切割图 this._laybase.style.width = this._laycropper.style.width = s.width + "px"; this._laybase.style.height = this._laycropper.style.height = s.height + "px"; //设置拖放范围 this._drag.mxright = s.width; this._drag.mxbottom = s.height; //设置缩放范围 if(this.resize){ this._resize.mxright = s.width; this._resize.mxbottom = s.height; } }, //获取当前样式 getpos: function() { with(this._layhandle){ return { top: offsettop, left: offsetleft, width: offsetwidth, height: offsetheight } } }, //获取尺寸 getsize: function(nowwidth, nowheight, fixwidth, fixheight) { var iwidth = nowwidth, iheight = nowheight, scale = iwidth / iheight; //按比例设置 if(fixheight){ iwidth = (iheight = fixheight) * scale; } if(fixwidth && (!fixheight || iwidth > fixwidth)){ iheight = (iwidth = fixwidth) / scale; } //返回尺寸对象 return { width: iwidth, height: iheight } } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
上一篇: vue实现内容可滚动的弹窗效果
推荐阅读
-
nodejs实现获取本地文件夹下图片信息功能示例
-
在Asp.Net Core中配置使用MarkDown富文本编辑器实现图片上传和截图上传(开源代码.net core3.0)
-
详解nodejs实现本地上传图片并预览功能(express4.0+)
-
NodeJS实现图片上传代码(Express)
-
C#实现图片分割方法与代码
-
Node.js + express实现上传大文件的方法分析【图片、文本文件】
-
PHP利用百度ai实现文本和图片审核
-
nodejs实现爬取网站图片功能
-
Asp.Net Core中配置使用Kindeditor富文本编辑器实现图片上传和截图上传及文件管理和上传(开源代码.net core3.0)
-
使用Python合成图片的实现代码(图片添加个性化文本,图片上叠加其他图片)