1. produkty
  2.   obraz
  3.   JavaScript
  4.   LensJs
 
  

Open Source JavaScriptová knihovna pro zpracování obrázků

JavaScript API pro aplikování různých efektů na obrázky pomocí různých druhů filtrů, jako je gaussovský, odstíny šedi, horní propust, invertní, lalaciánský, zrcadlový, RGB, Robertsův, saturace a další.

Lena.js je velmi jednoduchá knihovna pro zpracování obrázků s nízkou hmotností, která umožňuje vývojářům softwaru pracovat s různými typy obrázků z jejich aplikací JavaScript. Je to čistě JavaScriptová knihovna, která může fungovat na Node i v prohlížeči bez jakýchkoliv externích závislostí. Knihovna je open source a je dostupná pod licencí MIT. Knihovna není příliš dobrá s těžkými obrázky v prohlížeči, ale je velmi účinná pro manipulaci s malými obrázky.

Lena.js se velmi snadno používá a může na obrázky aplikovat různé efekty. Obrazové filtry umožňují softwarovým aplikacím aplikovat různé efekty na obrázky jediným kliknutím. Knihovna obsahuje podporu pro několik důležitých obrazových filtrů, některé důležité jsou gaussovské, stupně šedi, horní propust, invertní, lalacian, zrcadlo, šum, Prewitt, RGB, Roberts, saturace, sépie, zaostření a mnoho dalších. Knihovna také podporuje použití více filtrů na obrázek. Filtry jsou uloženy ve stejné globální proměnné LenaJS a lze k nim přistupovat přes její id pomocí klíče nebo tečkové notace.

Previous Next

Začínáme s LenaJs

Doporučený způsob instalace LenaJs přes NPM. K instalaci použijte následující příkaz.

Nainstalujte Lena.Js přes NPM

 npm install lena.js --save

Použijte filtry na obrázek pomocí JavaScriptu

Open source knihovna Lena.js poskytuje sadu užitečných filtrů, které lze použít k aplikaci různých druhů efektů na obrázky v aplikacích JavaScript. Nejprve zadejte správnou adresu obrázku a poté vyberte filtr ze seznamu dostupných filtrů. Pro snadné použití filtru na vybraný obrázek můžete použít metody filterImage a redrawCanvas. K použití filtru se použije obrázek a plátno.

Přidejte filtr hluku pomocí JavaScriptu

 
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

Použití více filtrů na obrázky

Knihovna Lena.js umožňuje vývojářům softwaru aplikovat na obrázky v rámci jejich vlastních aplikací JavaScript více filtrů. Obvykle se na obrázek aplikuje jeden filtr metodou filterImage. Chcete-li na obrázek použít více filtrů, musíte místo filtrování použít metodu redrawCanvas. Musíte předat obrázek již vykreslený s filtrem jako první argument a musíte předat nový filtr jako druhý argument, který se snadno připojí k obrázku.

Zpracování obrázků přes JavaScript API

Knihovna LenaJs dává softwarovým programátorům možnost programově přidat filtr do obrázků v JavaScriptu. Použití filtrů s LenaJs je docela jednoduché, API poskytuje dva způsoby, jak přidat filtry; filterImage() a redrawCanvas(). Chcete-li použít filtr, musíte metodě poskytnout obrázek a plátno. Chcete-li získat filtr, můžete použít metodu LenaJs['filername'] a aplikovat ji na obrázek pomocí metody filterImage().

Použít kontrastní filtr na snímky<

 
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
 Čeština