Комплексні операції обробки зображень через JavaScript API 

Бібліотека JavaScript з відкритим вихідним кодом для виконання розширених завдань зі створення та обробки зображень, таких як зміна розміру зображення, накладення зображення на інше, розмивання зображення, масштабування зображення та багато іншого. 

Програма Jimp – Javascript Image Manipulation Program — це бібліотека Node.js з відкритим кодом, яка дає розробникам програмного забезпечення можливість виконувати складні операції обробки зображень у своїх власних програмах JavaScript. Він повністю написаний на JavaScript для Node, без будь-яких зовнішніх або нативних залежностей.

Бібліотека дуже корисна для розробки будь-яких розширених програм обробки зображень і є абсолютно безкоштовною, тому дає розробникам економічно ефективне рішення з простотою використання. Бібліотека містить кілька розширених функцій, пов’язаних із створенням і маніпулюванням зображеннями, такими як зміна розміру зображення, покращена якість зображень, накладання зображення на інше, розмиття зображення, масштабування зображення, застосування до зображення ефекту розмитості, перевертання зображення, інвертування кольори зображення, повертати зображення, друкувати текст на зображенні та багато іншого.

Бібліотека включає підтримку кількох розширених форматів зображень, таких як BMP, GIF, JPEG, PNG, TIFF та багато інших. Також доступні деякі додаткові плагіни, які можна використовувати для деяких додаткових функцій, наприклад плагін кола, який можна використовувати для створення кола із зображення, і плагін тіні, який створює тінь на зображенні. Доступні плагін ефекту риб’ячого ока та плагін порогового значення.

Previous Next

Початок роботи з Jimp

Ви можете встановити бібліотеку Jimp, виконавши просту команду в Node. Використовуйте наступну команду. 

Встановіть Jimp через NPM

npm install jimp 

Змінюйте розмір зображень за допомогою бібліотеки JavaScript

Бібліотека Jimp з відкритим вихідним кодом містить функцію зміни розміру зображень у своїх власних програмах JavaScript. Спочатку потрібно надати зображення та повний шлях до нього. Після цього ви можете вказати висоту або ширину, і бібліотека Jimp відповідно масштабує зображення. Задовольнившись, ви можете зберегти зображення у вибраному вами місці. Ви також можете легко масштабувати зображення, задавши спеціальну ширину та висоту, зберігаючи співвідношення сторін.

Змінюйте розмір зображень за допомогою JavaScript

import jimp from 'jimp';
async function main() {
	// Read the image.
	const image = await jimp.read('test/image.png');
	// Resize the image to width 150 and auto height.
	await image.resize(150, jimp.AUTO);
	// Save and overwrite the image
	await image.writeAsync('test/image.png');
}
main();

Перевертайте, масштабуйте або повертайте зображення за допомогою JavaScript

Бібліотека Jimp з відкритим вихідним кодом також надала функціональність для кількох важливих функцій, пов’язаних із маніпулюванням зображеннями. Це дозволяє розробнику перевертати, а також масштабувати зображення за допомогою лише кількох рядків коду JavaScript. Функція перевертання перевертає зображення горизонтально або вертикально. За замовчуванням зображення перевертається горизонтально. Функція повороту повертатиме зображення за годинниковою стрілкою, а розміри зображення залишаться незмінними.

Обертайте зображення за допомогою JavaScript API

import jimp from 'jimp';
async function main() {
  const image = await jimp.read('test/image.png');
  image.rotate(90);
}
main();

Застосуйте Gaussian & Color Mix до зображення

Розмиття за Гаусом — це широко використовуваний ефект у графічному програмному забезпеченні, як правило, для зменшення шуму зображення та зменшення деталей. Бібліотека Jimp з відкритим вихідним кодом дозволяє програмістам застосовувати справжнє розмиття за Гауссом до зображення у власному додатку. Зверніть увагу, що його обробка є відносно повільною порівняно з іншими бібліотечними функціями. Бібліотека також підтримує функцію змішування кольорів і змішує кольори за значеннями їхніх компонентів RGB, а величина — це непрозорість кольору, що накладається.

Застосуйте Гаусса до зображення в програмах JavaScript

import jimp from 'jimp';
async function main() {
  const image = await jimp.read('test/image.png');
  image.gaussian(15);
}
main();
 Українська