ITエンジニア/デザイナ向けにオープンソースを毎日紹介

ImageFilters.jsはJavaScript製のオープンソース・ソフトウェア(MIT License)です。

今は何でもJavaScriptという風潮があります。クライアントサイドで処理できるのは悪いことではなく、サーバ負荷の分散に役立つでしょう。今回は画像編集を行うImageFilters.jsを紹介します。


元の写真です。左側のメニューで適用するフィルタを選択します。


二値化。


ぼかし。


白黒。


エンボス。


エッジ。


反転。


色調反転。


モザイク。


油絵。


リスケール。


露出変更。


渦巻き。

ImageFilters.jsでは多数のAPIが用意されており、指定した画像に対してエフェクトができるようになっています。画像はCanvasを使って出力されます。出力後、パラメータを変更してさらに加工も可能です。


MOONGIFTはこう見る

ImageFilters.jsは細かな画像編集という訳ではなく、Instagram風にボタン一つでフィルタを適用してくれるタイプのソフトウェアです。フィルタの適用後、パラメータで細かく設定はできますが殆どの場合はこのままで十分と思われます。

その結果はCanvasから画像データを取り出すことで加工後の写真を保存するというのはさほど難しいことではありません。クライアントサイドでの加工であれば、パラメータを変えてリアルタイムにフィルタを変更するのも容易でしょう。画像加工についてはサーバサイドよりもクライアントサイドの方が良さそうです。

ImageFilters.js API Demos

arahaya/ImageFilters.js

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2