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.
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