经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置:技术经验 » JS/JS库/框架 » Node.js » 查看文章
NodeJS实现图片文本分割
来源:jb51  时间:2021/9/6 10:18:07  对本文有异议

本文实例为大家分享了NodeJS实现图片文本分割的具体代码,供大家参考,具体内容如下

  1. var fs = require('fs');
  2. var jpeg = require('jpeg-js')
  3. function getSumRGB(data, i)
  4. {
  5. var cr = data.data[i+0]
  6. var cg = data.data[i+1]
  7. var cb = data.data[i+2]
  8. var srgb = (cr+cg+cb)
  9. return srgb
  10. }
  11. function getTopRGB(data, i)
  12. {
  13. var topIndex = (data.width * 4 * -1)
  14. i= i + topIndex;
  15. var cr = data.data[i+0]
  16. var cg = data.data[i+1]
  17. var cb = data.data[i+2]
  18. return [cr,cg,cb]
  19. }
  20. function getHeightRGB(data, i, haveRGB)
  21. {
  22. var width = data.width
  23. var height = data.height
  24. var len = width * height * 4
  25. var haveNum = 0
  26. for(i=i;i<len;i+=width*4)
  27. {
  28. if(getSumRGB(data, i) == haveRGB)
  29. {
  30. haveNum++
  31. }
  32. }
  33. return haveNum
  34. }
  35. function ClearBackGround(data)
  36. {
  37. var width = data.width
  38. var height = data.height
  39. var len = width * height * 4
  40. var i, tmp
  41. for(i=0;i<len;i+=4)
  42. {
  43. tmp = getSumRGB(data, i)
  44. if(tmp > 120*3) {
  45. data.data[i+0]=255
  46. data.data[i+1]=255
  47. data.data[i+2]=255
  48. }
  49. }
  50. for(i=0;i<len;i+=4)
  51. {
  52. tmp = getSumRGB(data, i)
  53. if(tmp <= 32*3) {
  54. tmp = getTopRGB(data, i)
  55. data.data[i+0]=tmp[0]
  56. data.data[i+1]=tmp[1]
  57. data.data[i+2]=tmp[2]
  58. }
  59. }
  60. for(i=0;i<len;i+=4)
  61. {
  62. tmp = getSumRGB(data, i)
  63. if(tmp !=255*3) {
  64. data.data[i+0]=0
  65. data.data[i+1]=0
  66. data.data[i+2]=0
  67. }
  68. }
  69. var maxwidth = width * 4
  70. var arrlist = []
  71. arrlist[0]=[]
  72. arrlist[1]=[]
  73. arrlist[2]=[]
  74. arrlist[3]=[]
  75. arrnum = 0
  76. block = 0
  77. for(i=0;i<maxwidth;i+=4)
  78. {
  79. tmp= getHeightRGB(data, i, 0)
  80. if(tmp==0) {
  81. if(block != 0) {
  82. arrlist[arrnum] = [block/4,i/4]
  83. block=0
  84. arrnum++
  85. }
  86. } else if(tmp >0 ) {
  87. if(block == 0) {
  88. block = i
  89. }
  90. }
  91. }
  92. console.log(arrlist)
  93. return data
  94. }
  95. var picname = "tmp.jpg"
  96. var newpicname= "000.jpg"
  97. var jpegData = fs.readFileSync(picname)
  98. var rawImageData = jpeg.decode(jpegData, {useTArray: true})
  99. rawImageData = ClearBackGround(rawImageData)
  100. var jpegImageData = jpeg.encode(rawImageData,100)
  101. fs.writeFileSync(newpicname, jpegImageData.data)

再为大家分享JS实现图片切割的方法:

  1. //图片切割
  2. var ImgCropper = Class.create();
  3. ImgCropper.prototype = {
  4. //容器对象,控制层,图片地址
  5. initialize: function(container, handle, url, options) {
  6. this._Container = $(container);//容器对象
  7. this._layHandle = $(handle);//控制层
  8. this.Url = url;//图片地址
  9. this._layBase = this._Container.appendChild(document.createElement("img"));//底层
  10. this._layCropper = this._Container.appendChild(document.createElement("img"));//切割层
  11. this._layCropper.onload = Bind(this, this.SetPos);
  12. //用来设置大小
  13. this._tempImg = document.createElement("img");
  14. this._tempImg.onload = Bind(this, this.SetSize);
  15. this.SetOptions(options);
  16. this.Opacity = Math.round(this.options.Opacity);
  17. this.Color = this.options.Color;
  18. this.Scale = !!this.options.Scale;
  19. this.Ratio = Math.max(this.options.Ratio, 0);
  20. this.Width = Math.round(this.options.Width);
  21. this.Height = Math.round(this.options.Height);
  22. //设置预览对象
  23. var oPreview = $(this.options.Preview);//预览对象
  24. if(oPreview){
  25. oPreview.style.position = "relative";
  26. oPreview.style.overflow = "hidden";
  27. this.viewWidth = Math.round(this.options.viewWidth);
  28. this.viewHeight = Math.round(this.options.viewHeight);
  29. //预览图片对象
  30. this._view = oPreview.appendChild(document.createElement("img"));
  31. this._view.style.position = "absolute";
  32. this._view.onload = Bind(this, this.SetPreview);
  33. }
  34. //设置拖放
  35. this._drag = new Drag(this._layHandle, { Limit: true, onMove: Bind(this, this.SetPos), Transparent: true });
  36. //设置缩放
  37. this.Resize = !!this.options.Resize;
  38. if(this.Resize){
  39. var op = this.options, _resize = new Resize(this._layHandle, { Max: true, onResize: Bind(this, this.SetPos) });
  40. //设置缩放触发对象
  41. op.RightDown && (_resize.Set(op.RightDown, "right-down"));
  42. op.LeftDown && (_resize.Set(op.LeftDown, "left-down"));
  43. op.RightUp && (_resize.Set(op.RightUp, "right-up"));
  44. op.LeftUp && (_resize.Set(op.LeftUp, "left-up"));
  45. op.Right && (_resize.Set(op.Right, "right"));
  46. op.Left && (_resize.Set(op.Left, "left"));
  47. op.Down && (_resize.Set(op.Down, "down"));
  48. op.Up && (_resize.Set(op.Up, "up"));
  49. //最小范围限制
  50. this.Min = !!this.options.Min;
  51. this.minWidth = Math.round(this.options.minWidth);
  52. this.minHeight = Math.round(this.options.minHeight);
  53. //设置缩放对象
  54. this._resize = _resize;
  55. }
  56. //设置样式
  57. this._Container.style.position = "relative";
  58. this._Container.style.overflow = "hidden";
  59. this._layHandle.style.zIndex = 200;
  60. this._layCropper.style.zIndex = 100;
  61. this._layBase.style.position = this._layCropper.style.position = "absolute";
  62. this._layBase.style.top = this._layBase.style.left = this._layCropper.style.top = this._layCropper.style.left = 0;//对齐
  63. //初始化设置
  64. this.Init();
  65. },
  66. //设置默认属性
  67. SetOptions: function(options) {
  68. this.options = {//默认值
  69. Opacity: 50,//透明度(0到100)
  70. Color: "",//背景色
  71. Width: 0,//图片高度
  72. Height: 0,//图片高度
  73. //缩放触发对象
  74. Resize: false,//是否设置缩放
  75. Right: "",//右边缩放对象
  76. Left: "",//左边缩放对象
  77. Up: "",//上边缩放对象
  78. Down: "",//下边缩放对象
  79. RightDown: "",//右下缩放对象
  80. LeftDown: "",//左下缩放对象
  81. RightUp: "",//右上缩放对象
  82. LeftUp: "",//左上缩放对象
  83. Min: false,//是否最小宽高限制(为true时下面min参数有用)
  84. minWidth: 50,//最小宽度
  85. minHeight: 50,//最小高度
  86. Scale: false,//是否按比例缩放
  87. Ratio: 0,//缩放比例(宽/高)
  88. //预览对象设置
  89. Preview: "",//预览对象
  90. viewWidth: 0,//预览宽度
  91. viewHeight: 0//预览高度
  92. };
  93. Extend(this.options, options || {});
  94. },
  95. //初始化对象
  96. Init: function() {
  97. //设置背景色
  98. this.Color && (this._Container.style.backgroundColor = this.Color);
  99. //设置图片
  100. this._tempImg.src = this._layBase.src = this._layCropper.src = this.Url;
  101. //设置透明
  102. if(isIE){
  103. this._layBase.style.filter = "alpha(opacity:" + this.Opacity + ")";
  104. } else {
  105. this._layBase.style.opacity = this.Opacity / 100;
  106. }
  107. //设置预览对象
  108. this._view && (this._view.src = this.Url);
  109. //设置缩放
  110. if(this.Resize){
  111. with(this._resize){
  112. Scale = this.Scale; Ratio = this.Ratio; Min = this.Min; minWidth = this.minWidth; minHeight = this.minHeight;
  113. }
  114. }
  115. },
  116. //设置切割样式
  117. SetPos: function() {
  118. //ie6渲染bug
  119. if(isIE6){ with(this._layHandle.style){ zoom = .9; zoom = 1; }; };
  120. //获取位置参数
  121. var p = this.GetPos();
  122. //按拖放对象的参数进行切割
  123. this._layCropper.style.clip = "rect(" + p.Top + "px " + (p.Left + p.Width) + "px " + (p.Top + p.Height) + "px " + p.Left + "px)";
  124. //设置预览
  125. this.SetPreview();
  126. },
  127. //设置预览效果
  128. SetPreview: function() {
  129. if(this._view){
  130. //预览显示的宽和高
  131. var p = this.GetPos(), s = this.GetSize(p.Width, p.Height, this.viewWidth, this.viewHeight), scale = s.Height / p.Height;
  132. //按比例设置参数
  133. var pHeight = this._layBase.height * scale, pWidth = this._layBase.width * scale, pTop = p.Top * scale, pLeft = p.Left * scale;
  134. //设置预览对象
  135. with(this._view.style){
  136. //设置样式
  137. width = pWidth + "px"; height = pHeight + "px"; top = - pTop + "px "; left = - pLeft + "px";
  138. //切割预览图
  139. clip = "rect(" + pTop + "px " + (pLeft + s.Width) + "px " + (pTop + s.Height) + "px " + pLeft + "px)";
  140. }
  141. }
  142. },
  143. //设置图片大小
  144. SetSize: function() {
  145. var s = this.GetSize(this._tempImg.width, this._tempImg.height, this.Width, this.Height);
  146. //设置底图和切割图
  147. this._layBase.style.width = this._layCropper.style.width = s.Width + "px";
  148. this._layBase.style.height = this._layCropper.style.height = s.Height + "px";
  149. //设置拖放范围
  150. this._drag.mxRight = s.Width; this._drag.mxBottom = s.Height;
  151. //设置缩放范围
  152. if(this.Resize){ this._resize.mxRight = s.Width; this._resize.mxBottom = s.Height; }
  153. },
  154. //获取当前样式
  155. GetPos: function() {
  156. with(this._layHandle){
  157. return { Top: offsetTop, Left: offsetLeft, Width: offsetWidth, Height: offsetHeight }
  158. }
  159. },
  160. //获取尺寸
  161. GetSize: function(nowWidth, nowHeight, fixWidth, fixHeight) {
  162. var iWidth = nowWidth, iHeight = nowHeight, scale = iWidth / iHeight;
  163. //按比例设置
  164. if(fixHeight){ iWidth = (iHeight = fixHeight) * scale; }
  165. if(fixWidth && (!fixHeight || iWidth > fixWidth)){ iHeight = (iWidth = fixWidth) / scale; }
  166. //返回尺寸对象
  167. return { Width: iWidth, Height: iHeight }
  168. }
  169. }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持w3xue。

 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号