NodeJS realizes image text segmentation

NodeJS realizes image text segmentation

This article shares the specific code of NodeJS to implement image text segmentation for your reference. The specific content is as follows

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)

Let me share with you the method of implementing image cutting with JS:

//Picture cutting var ImgCropper = Class.create();
ImgCropper.prototype = {
  //Container object, control layer, image address initialize: function(container, handle, url, options) {
    this._Container = $(container);//Container objectthis._layHandle = $(handle);//Control layerthis.Url = url;//Image addressthis._layBase = this._Container.appendChild(document.createElement("img"));//Bottom layerthis._layCropper = this._Container.appendChild(document.createElement("img"));//Cutting layerthis._layCropper.onload = Bind(this, this.SetPos);
    //Used to set the size 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);
    
    //Set the preview object var oPreview = $(this.options.Preview); //Preview object if (oPreview) {
        oPreview.style.position = "relative";
        oPreview.style.overflow = "hidden";
        this.viewWidth = Math.round(this.options.viewWidth);
        this.viewHeight = Math.round(this.options.viewHeight);
        //Preview image object this._view = oPreview.appendChild(document.createElement("img"));
        this._view.style.position = "absolute";
        this._view.onload = Bind(this, this.SetPreview);
    }
    //Set up drag and drop this._drag = new Drag(this._layHandle, { Limit: true, onMove: Bind(this, this.SetPos), Transparent: true });
    //Set zoom this.Resize = !!this.options.Resize;
    if(this.Resize){
        var op = this.options, _resize = new Resize(this._layHandle, { Max: true, onResize: Bind(this, this.SetPos) });
        //Set the zoom trigger object 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"));
        //Minimum range limit this.Min = !!this.options.Min;
        this.minWidth = Math.round(this.options.minWidth);
        this.minHeight = Math.round(this.options.minHeight);
        //Set the scaling object this._resize = _resize;
    }
    //Set style 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; //Alignment //Initialization settings this.Init();
  },
  //Set default properties SetOptions: function(options) {
    this.options = {//Default value Opacity: 50, //Transparency (0 to 100)
        Color: "", //Background colorWidth: 0, //Image heightHeight: 0, //Image height//Scaling trigger objectResize: false, //Whether to set scalingRight: "", //Right scaling objectLeft: "", //Left scaling objectUp: "", //Upper scaling objectDown: "", //Bottom scaling objectRightDown: "", //Bottom right scaling objectLeftDown: "", //Bottom left scaling objectRightUp: "", //Upper right scaling objectLeftUp: "", //Upper left scaling objectMin: false, //Whether to set minimum width and height limit (the min parameter below is useful when true)
        minWidth: 50, // minimum width minHeight: 50, // minimum height Scale: false, // whether to scale proportionally Ratio: 0, // scaling ratio (width/height)
        //Preview object settings Preview: "", //Preview object viewWidth: 0, //Preview width viewHeight: 0 //Preview height };
    Extend(this.options, options || {});
  },
  // Initialize the object Init: function() {
    //Set the background color this.Color && (this._Container.style.backgroundColor = this.Color);
    //Set the picture this._tempImg.src = this._layBase.src = this._layCropper.src = this.Url;
    //Set transparent if(isIE){
        this._layBase.style.filter = "alpha(opacity:" + this.Opacity + ")";
    } else {
        this._layBase.style.opacity = this.Opacity / 100;
    }
    //Set the preview object this._view && (this._view.src = this.Url);
    //Set zoom if (this.Resize) {
        with(this._resize){
            Scale = this.Scale; Ratio = this.Ratio; Min = this.Min; minWidth = this.minWidth; minHeight = this.minHeight;
        }
    }
  },
  //Set cutting style SetPos: function() {
    //IE6 rendering bug
    if (isIE6) { with (this._layHandle.style) { zoom = .9; zoom = 1; }; };
    //Get position parameters var p = this.GetPos();
    //Cut according to the parameters of the drag and drop object this._layCropper.style.clip = "rect(" + p.Top + "px " + (p.Left + p.Width) + "px " + (p.Top + p.Height) + "px " + p.Left + "px)";
    //Set preview this.SetPreview();
  },
  //Set the preview effect SetPreview: function() {
    if(this._view){
        //Preview display width and height var p = this.GetPos(), s = this.GetSize(p.Width, p.Height, this.viewWidth, this.viewHeight), scale = s.Height / p.Height;
        //Set parameters proportionally var pHeight = this._layBase.height * scale, pWidth = this._layBase.width * scale, pTop = p.Top * scale, pLeft = p.Left * scale;
        //Set the preview object with(this._view.style){
            //Set style width = pWidth + "px"; height = pHeight + "px"; top = - pTop + "px "; left = - pLeft + "px";
            //Cutting preview image clip = "rect(" + pTop + "px " + (pLeft + s.Width) + "px " + (pTop + s.Height) + "px " + pLeft + "px)";
        }
    }
  },
  //Set the image size SetSize: function() {
    var s = this.GetSize(this._tempImg.width, this._tempImg.height, this.Width, this.Height);
    //Set the base map and cutting map this._layBase.style.width = this._layCropper.style.width = s.Width + "px";
    this._layBase.style.height = this._layCropper.style.height = s.Height + "px";
    //Set the drag and drop range this._drag.mxRight = s.Width; this._drag.mxBottom = s.Height;
    //Set the zoom range if (this.Resize) { this._resize.mxRight = s.Width; this._resize.mxBottom = s.Height; }
  },
  //Get the current style GetPos: function() {
    with(this._layHandle){
        return { Top: offsetTop, Left: offsetLeft, Width: offsetWidth, Height: offsetHeight }
    }
  },
  //Get size GetSize: function(nowWidth, nowHeight, fixWidth, fixHeight) {
    var iWidth = nowWidth, iHeight = nowHeight, scale = iWidth / iHeight;
    //Set according to the proportion if (fixHeight) { iWidth = (iHeight = fixHeight) * scale; }
    if(fixWidth && (!fixHeight || iWidth > fixWidth)){ iHeight = (iWidth = fixWidth) / scale; }
    //Return size object return { Width: iWidth, Height: iHeight }
  }
}

The above is the full content of this article. I hope it will be helpful for everyone’s study. I also hope that everyone will support 123WORDPRESS.COM.

You may also be interested in:
  • js to split and upload large files

<<:  Detailed tutorial on installing and configuring MySQL 5.7.20 under Centos7

>>:  Record the process of connecting to the local Linux virtual machine via SSH

Recommend

Vue+Vant implements the top search bar

This article example shares the specific code of ...

How to uninstall and reinstall Tomcat (with pictures and text)

Uninstall tomcat9 1. Since the installation of To...

What does input type mean and how to limit input

Common methods for limiting input 1. To cancel the...

A brief analysis of the differences between undo, redo and binlog in MySQL

Table of contents Preface 【undo log】 【redo log】 【...

Detailed explanation of Bind mounts for Docker data storage

Before reading this article, I hope you have a pr...

HTML table tag tutorial (35): cross-column attribute COLSPAN

In a complex table structure, some cells span mul...

Javascript basics about built-in objects

Table of contents 1. Introduction to built-in obj...

MySQL 20 high-performance architecture design principles (worth collecting)

Open Source Database Architecture Design Principl...

How to create and run a Django project in Ubuntu 16.04 under Python 3

Step 1: Create a Django project Open the terminal...

HTML table only displays the outer border of the table

I would like to ask a question. In Dreamweaver, I...

MySQL multi-instance deployment and installation guide under Linux

What is MySQL multi-instance Simply put, MySQL mu...

Example of cross-database query in MySQL

Preface In MySQL, cross-database queries are main...

Teach you how to implement the observer mode in Javascript

Table of contents What is the Observer Pattern? S...