Open-Source-JavaScript-Bibliothek für die Bildverarbeitung
JavaScript-API zum Anwenden verschiedener Effekte auf Bilder mit verschiedenen Arten von Filtern wie Gaussian, Graustufen, Hochpass, Invertieren, Laplace, Spiegeln, RGB, Roberts, Sättigung und mehr.
Lena.js ist eine sehr einfache, leichtgewichtige Bildverarbeitungsbibliothek, die es Software-Entwicklern ermöglicht, mit verschiedenen Arten von Bildern aus ihren JavaScript Anwendungen zu arbeiten. Es ist eine reine JavaScript Bibliothek, die sowohl auf Knoten als auch im Browser ohne externe Abhängigkeiten funktionieren kann. Die Bibliothek ist Open Source und steht unter der IT-Lizenz zur Verfügung. Die Bibliothek ist nicht sehr gut mit schweren Bildern im Browser, aber sehr effizient für die Manipulation von kleinen Bildern.
Lena.js ist sehr einfach zu benutzen und kann verschiedene Effekte auf Bilder anwenden. Die Bildfilter ermöglichen es Software-Apps, mit nur einem Klick verschiedene Effekte auf Bilder anzuwenden. Die Bibliothek hat Unterstützung für mehrere wichtige Bildfilter, einige wichtige sind russian, grauscale, Highways, invert, laplacian, mirror, noise, Predict, GB, Sättigung, Sättigung. Die Bibliothek unterstützt auch die Anwendung mehrerer Filter auf ein Bild. Die Filter werden in der gleichen globalen Variable LenaJS gespeichert und können über ihre ID mit dem Schlüssel oder Punkt-Notation aufgerufen werden.
Erste Schritte mit LenaJs
Der empfohlene Weg, um LenaJs über NPM zu installieren. Bitte verwenden Sie den folgenden Befehl, um es zu installieren.
Installieren Sie Lena.Js über NPM
npm install lena.js --save Wenden Sie Filter auf Bilder über JavaScript an
Die Open Source Lena.js Bibliothek hat eine Reihe nützlicher Filter bereitgestellt, die verwendet werden können, um verschiedene Effekte auf Bilder innerhalb von JavaScript Anwendungen anzuwenden. Bitte geben Sie zunächst die richtige Adresse an und wählen Sie den Filter aus der Liste der verfügbaren Filter. Sie können die Methoden filterImage und redrawCanvas benutzen, um einen Filter auf das ausgewählte Bild anzuwenden. Ein Bild und eine Leinwand werden verwendet, um den Filter anzuwenden.
Der 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
Anwenden mehrerer Filter auf Bilder
Die Lena.js-Bibliothek ermöglicht es Softwareentwicklern, mehrere Filter auf ihre Bilder in ihren eigenen JavaScript-Apps anzuwenden. Normalerweise wird ein einzelner Filter mit der Methode filterImage auf ein Bild angewendet. Um mehrere Filter auf ein Bild anzuwenden, müssen Sie die redrawCanvas-Methode anstelle von filterImage verwenden. Sie müssen ein bereits mit einem Filter gerendertes Bild als erstes Argument und einen neuen Filter als zweites Argument übergeben, das problemlos an das Bild angehängt wird.
Verarbeitung von Bildern über JavaScript-API
Die LenaJs-Bibliothek gibt Software-Programmierern die Möglichkeit, einen Filter in Bildern innerhalb von JavaScript hinzuzufügen. Die Anwendung von Filtern mit LenaJs ist ziemlich einfach, die API bietet zwei Möglichkeiten, Filter hinzuzufügen: filterImage() und redrawCanvas(). Sie müssen ein Bild und eine Leinwand zur Anwendung des Filters angeben. Um den Filter zu erhalten, können Sie die Methode LenaJs['filename'] verwenden und sie mit der Methode filterImage() auf das Bild anwenden.
Kontrastfilter auf Bildern anzuwenden, ist nicht
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
