JavaScript-bibliotek med öppen källkod för bildbehandling

JavaScript API för att applicera olika effekter på bilder med olika sorters filter som gaussian, gråskala, highpass, invert, laplacian, mirror, RGB, Roberts, saturation och mer.

Lena.js är ett mycket enkelt lätt bildbehandlingsbibliotek som gör det möjligt för mjukvaruutvecklare att arbeta med olika typer av bilder inifrån sina JavaScript-applikationer. Det är ett rent JavaScript-bibliotek som kan fungera på Node såväl som i webbläsaren utan några externa beroenden. Biblioteket är öppen källkod och är tillgängligt under MIT-licensen. Biblioteket är inte särskilt bra med tunga bilder inne i webbläsaren men är mycket effektivt för manipulering av små bilder.

Lena.js är väldigt lätt att använda och kan applicera olika effekter på bilder. Bildfiltren gör att programvaruappar kan använda olika effekter på bilder med bara ett klick. Biblioteket har inkluderat stöd för flera viktiga bildfilter, några viktiga är gaussisk, gråskala, högpass, invert, laplacian, spegel, brus, Prewitt, RGB, Roberts, saturation, sepia, skärpa och många fler. Biblioteket stöder också applicering av flera filter på en bild. Filtren lagras i samma globala variabel LenaJS och kan nås via dess id med nyckel- eller punktnotation.

Previous Next

Komma igång med LenaJs

Det rekommenderade sättet att installera LenaJs via NPM. Använd följande kommando för att installera det.

Installera Lena.Js via NPM

 npm install lena.js --save 

Använd filter på bild via JavaScript

Lena.js-biblioteket med öppen källkod har tillhandahållit en uppsättning användbara filter som kan användas för att applicera olika typer av effekter på bilder i JavaScript-applikationer. Ange först rätt adress till bilden och välj sedan filtret från listan över tillgängliga filter. Du kan använda metoderna filterImage och redrawCanvas för att enkelt tillämpa ett filter på den valda bilden. En bild och en duk kommer att användas för att tillämpa filtret.

Lägg till brusfilter via JavaScript

 
const noise = function (pixels, amount = 0) {
  const level = amount * 255 * 0.1
  let random;
  for (let i = 0; i < pixels.data.length; i += 4) {
    random = (0.5 - Math.random()) * level;
    pixels.data[i] += random;
    pixels.data[i + 1] += random;
    pixels.data[i + 2] += random;
  }
  return pixels
}
export default noise
 

Använda flera filter på bilder

Lena.js-biblioteket gör det möjligt för mjukvaruutvecklare att använda flera filter på sina bilder i sina egna JavaScript-appar. Vanligtvis tillämpas ett enda filter på en bild genom filterImage-metoden. För att tillämpa flera filter på en bild måste du använda metoden redrawCanvas istället för filterImage. Du måste skicka en bild som redan renderats med ett filter som det första argumentet och måste skicka ett nytt filter som ett andra argument som enkelt kommer att läggas till i bilden.

Bearbeta bilder via JavaScript API

LenaJs-biblioteket ger programvaruprogrammerare möjligheten att programmatiskt lägga till ett filter i bilder i JavaScript. Att applicera filter med LenaJs är ganska enkelt, API ger två sätt att lägga till filter; filterImage() och redrawCanvas(). Du måste tillhandahålla en bild och en duk till metoden för att tillämpa filtret. För att få filtret kan du använda metoden LenaJs['filernamn'] och tillämpa den på bilden med metoden filterImage().

Använd kontrastfilter på bilder<

 
const contrast = function (pixels, amount) {
  const level = Math.pow((amount + 100) / 100, 2)
  let data = pixels.data
  let r
  let g
  let b
  for (let i = 0; i < data.length; i += 4) {
    r = data[i]
    g = data[i + 1]
    b = data[i + 2]
    r = r / 255
    r -= 0.5
    r *= level
    r += 0.5
    r *= 255
    g = g / 255
    g -= 0.5
    g *= level
    g += 0.5
    g *= 255
    b = b / 255
    b -= 0.5
    b *= level
    b += 0.5
    b *= 255
    r = r < 0 ? 0 : r > 255 ? 255 : r
    g = g < 0 ? 0 : g > 255 ? 255 : g
    b = b < 0 ? 0 : b > 255 ? 255 : b
    data[i] = r
    data[i + 1] = g
    data[i + 2] = b
  }
  return pixels
}
export default contrast
 
 Svenska