Bibliothèque JavaScript Open Source pour le traitement d'images
API JavaScript pour appliquer différents effets aux images à l'aide de différents types de filtres tels que gaussien, niveaux de gris, passe-haut, inverse, laplacien, miroir, RVB, Roberts, saturation, etc.
Lena.js est une bibliothèque de traitement d'image très simple et légère qui permet aux développeurs de logiciels de travailler avec différents types d'images à partir de leurs applications JavaScript. Il s'agit d'une bibliothèque JavaScript pure qui peut fonctionner sur Node ainsi que dans le navigateur sans aucune dépendance externe. La bibliothèque est open source et est disponible sous licence MIT. La bibliothèque n'est pas très bonne avec des images lourdes à l'intérieur du navigateur mais est très efficace pour la manipulation de petites images.
Lena.js est très facile à utiliser et peut appliquer différents effets aux images. Les filtres d'images permettent aux logiciels d'appliquer différents effets sur les images avec un seul clic. La bibliothèque a apporté son soutien à plusieurs filtres d'images importants, certains sont russiens, gris, autoroutes, invert, laplacian, miroir, bruit, etc. La bibliothèque appuie également l'application de filtres multiples à une image. Les filtres sont entreposés dans la même variable globale LenaJS et peuvent être consultés par le ralenti en utilisant la mention de la clé ou du point.
Premiers pas avec LenaJs
La méthode recommandée pour installer LenaJs via NPM. Veuillez utiliser la commande suivante pour l'installer.
Installer Lena.Js via NPM
npm install lena.js --save
Appliquer des filtres sur l'image via JavaScript
La bibliothèque de la source ouverte Lena.js a fourni un ensemble de filtres utiles qui peuvent servir à appliquer différents types d'effets aux images dans JavaScript applications. Veuillez d'abord fournir l'adresse correcte de l'image et ensuite sélectionner le filtre à partir de la liste des filtres disponibles. Vous pouvez utiliser les méthodes filterImage et redrawCanvas pour appliquer facilement un filtre à l'image choisie. Une image et une toile seront utilisées pour appliquer le filtre.
Ajouter le filtre de bruit par 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
Application de plusieurs filtres sur les images
La bibliothèque Lena.js permet aux développeurs de logiciels d'appliquer plusieurs filtres sur leurs images dans leurs propres applications JavaScript. Habituellement, un seul filtre est appliqué à une image par la méthode filterImage. Pour appliquer plusieurs filtres à une image, vous devez utiliser la méthode redrawCanvas au lieu de filterImage. Vous devez passer une image déjà rendue avec un filtre comme premier argument et passer un nouveau filtre comme deuxième argument qui sera facilement ajouté à l'image.
Traitement des images via l'API JavaScript
La bibliothèque de LenaJs logiciels permet aux programmateurs d'ajouter systématiquement un filtre dans des images à l'intérieur de JavaScript. L'application de filtres avec LenaJs est assez simple, les API offrent deux façons d'ajouter des filtres; filterImage() et redrawCanvas(). Vous devez fournir une image et une toile à la méthode pour appliquer le filtre. Afin d'obtenir le filtre, vous pouvez utiliser la méthode LenaJs [nom] et l'appliquer à l'image en utilisant la méthode filterImage().
Appliquer un filtre de contraste sur les images
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