ספריית JavaScript בקוד פתוח לעיבוד תמונה
JavaScript API להחלת אפקטים שונים על תמונות באמצעות סוגים שונים של מסננים כגון גאוס, גווני אפור, Highpass, Invert, Lalacian, Mirror,RGB, Roberts, Saturation ועוד.
Lena.js היא ספריית עיבוד תמונה קלה מאוד המאפשרת למפתחי תוכנה לעבוד עם סוגים שונים של תמונות מתוך יישומי JavaScript שלהם. זוהי ספריית JavaScript טהורה שיכולה לעבוד על Node כמו גם בדפדפן ללא תלות חיצונית. הספרייה היא בקוד פתוח וזמינה תחת רישיון MIT. הספרייה לא מאוד טובה עם תמונות כבדות בתוך הדפדפן אבל היא מאוד יעילה למניפולציה של תמונות קטנות.
Lena.js קל מאוד לשימוש ויכול להחיל אפקטים שונים על תמונות. מסנני התמונות מאפשרים לאפליקציות תוכנה להחיל אפקטים שונים על תמונות בלחיצה אחת בלבד. הספרייה כללה תמיכה במספר מסנני תמונה חשובים, חלקם החשובים הם גאוס, גווני אפור, highpass, הפוך, laplacian, מראה, רעש, Prewitt, RGB, Roberts, רוויה, ספיה, חידוד ועוד רבים. הספרייה תומכת גם בהחלת מסננים מרובים על תמונה. המסננים מאוחסנים באותו משתנה גלובלי LenaJS וניתן לגשת אליהם דרך המזהה שלו באמצעות סימון המפתח או הנקודה.
תחילת העבודה עם LenaJs
הדרך המומלצת להתקין את LenaJs דרך NPM. אנא השתמש בפקודה הבאה כדי להתקין אותו.
התקן את Lena.Js דרך NPM
npm install lena.js --save
החל מסננים על תמונה באמצעות JavaScript
ספריית הקוד הפתוח Lena.js סיפקה קבוצה של מסננים שימושיים שניתן להשתמש בהם כדי להחיל סוגים שונים של אפקטים על תמונות בתוך יישומי JavaScript. תחילה אנא ספק את הכתובת הנכונה לתמונה ולאחר מכן בחר את המסנן מרשימת המסננים הזמינים. אתה יכול להשתמש בשיטות filterImage ו-redrawCanvas כדי להחיל מסנן בקלות על התמונה שנבחרה. תמונה וקנבס ישמשו להחלת המסנן.
הוסף מסנן רעש באמצעות 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
החלת מסננים מרובים על תמונות
ספריית Lena.js מאפשרת למפתחי תוכנה להחיל מסננים מרובים על התמונות שלהם בתוך יישומי JavaScript שלהם. בדרך כלל, מסנן בודד מוחל על תמונה לפי שיטת filterImage. כדי להחיל מסננים מרובים על תמונה, עליך להשתמש בשיטת redrawCanvas במקום filterImage. אתה צריך להעביר תמונה שכבר מוצגת עם פילטר כארגומנט הראשון וצריך להעביר פילטר חדש כארגומנט שני שיצורף לתמונה בקלות.
עיבוד תמונות באמצעות JavaScript API
ספריית LenaJs מעניקה למתכנתי תוכנה את היכולת להוסיף פילטר בתמונות ב-JavaScript. החלת מסננים עם LenaJs היא די פשוטה, ה-API מספק שתי דרכים להוסיף מסננים; filterImage() ו-redrawCanvas(). אתה צריך לספק תמונה וקנבס לשיטה להחלת המסנן. על מנת לקבל את המסנן, אתה יכול להשתמש בשיטה LenaJs['filername'] ולהחיל אותה על התמונה באמצעות שיטת filterImage().
החל מסנן ניגודיות על תמונות<
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