1. Tuotteet
  2.   Kuva
  3.   JavaScript
  4.   LensJs
 
  

Avoimen lähdekoodin JavaScript-kirjasto kuvankäsittelyä varten

JavaScript API erilaisten tehosteiden lisäämiseen kuviin käyttämällä erilaisia suodattimia, kuten gaussi-, harmaasävy-, ylipäästö-, käänteis-, laplacian-, peili-, RGB-, Roberts-, kylläisyys- ja muita suodattimia.

Lena.js on hyvin yksinkertainen ja kevyt kuvankäsittelykirjasto, jonka avulla ohjelmistokehittäjät voivat työskennellä erityyppisten kuvien kanssa JavaScript-sovellustensa sisällä. Se on puhdas JavaScript-kirjasto, joka voi toimia sekä Nodessa että selaimessa ilman ulkoisia riippuvuuksia. Kirjasto on avoimen lähdekoodin ja on saatavilla MIT-lisenssillä. Kirjasto ei ole kovin hyvä selaimen sisällä olevien raskaiden kuvien kanssa, mutta se on erittäin tehokas pienten kuvien käsittelyyn.

Lena.js on erittäin helppokäyttöinen ja se voi käyttää erilaisia tehosteita kuviin. Kuvasuodattimien avulla ohjelmistosovellukset voivat lisätä kuviin erilaisia tehosteita yhdellä napsautuksella. Kirjasto on sisältänyt tuen useille tärkeille kuvasuodattimille, joista tärkeitä ovat Gauss-, harmaasävy-, ylipäästö-, invertti-, laplacian-, peili-, kohina-, Prewitt-, RGB-, Roberts-, saturaatio-, seepia-, terävöitys- ja monet muut. Kirjasto tukee myös useiden suodattimien käyttämistä kuvaan. Suodattimet on tallennettu samaan globaaliin muuttujaan LenaJS, ja niihin pääsee käsiksi sen tunnuksen kautta näppäimen tai pisteen avulla.

Previous Next

LenaJs:n käytön aloittaminen

Suositeltu tapa asentaa LenaJs NPM:n kautta. Käytä seuraavaa komentoa asentaaksesi se.

Asenna Lena.Js NPM:n kautta

 npm install lena.js --save 

Käytä suodattimia kuvassa JavaScriptin kautta

Avoimen lähdekoodin Lena.js-kirjasto on tarjonnut joukon hyödyllisiä suodattimia, joita voidaan käyttää erilaisten tehosteiden lisäämiseen JavaScript-sovellusten kuviin. Anna ensin kuvan oikea osoite ja valitse sitten suodatin käytettävissä olevien suodattimien luettelosta. FilterImage- ja redrawCanvas-menetelmillä voit helposti käyttää suodatinta valittuun kuvaan. Suodattimen käyttämiseen käytetään kuvaa ja kangasta.

Lisää melusuodatin JavaScriptin kautta

 
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
 

Useiden suodattimien käyttäminen kuviin

Lena.js-kirjaston avulla ohjelmistokehittäjät voivat käyttää useita suodattimia kuviinsa omissa JavaScript-sovelluksissaan. Yleensä kuvaan käytetään yhtä suodatinta filterImage-menetelmällä. Jos haluat käyttää kuvaan useita suodattimia, sinun on käytettävä redrawCanvas-menetelmää filterImagen sijaan. Sinun on välitettävä kuva, joka on jo renderöity suodattimella ensimmäisenä argumenttina, ja sinun on välitettävä uusi suodatin toisena argumenttina, joka liitetään kuvaan helposti.

Kuvien käsittely JavaScript API:n kautta

LenaJs-kirjasto antaa ohjelmoijille mahdollisuuden lisätä ohjelmallisesti suodattimen kuviin JavaScriptin sisällä. Suodattimien käyttäminen LenaJ:n kanssa on melko yksinkertaista, API tarjoaa kaksi tapaa lisätä suodattimia; filterImage() ja redrawCanvas(). Sinun on annettava menetelmälle kuva ja kangas, jotta voit käyttää suodatinta. Suodattimen saamiseksi voit käyttää LenaJs['tiedostonimi']-metodia ja soveltaa sitä kuvaan filterImage()-menetelmällä.

Käytä kuviin kontrastisuodatinta<

 
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
 
 Suomen