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

jQuery CompareWYW pluginは二つの写真をスライダーを使って表示を切り替えられるソフトウェアです。

GitHubでは画像の差分表示がグラフィカルに行えるようになっています。スライダーを使って違っている部分をダイナミックに表示させられます。あれに衝撃を受けた方、同様の操作をjQuery CompareWYW pluginを使って実現できますよ!


デモです。中央のバーが左右に動きます。


寄せました。


逆に動かしました。


ドラッグではなく単にマウスを動かすだけで良いバージョンもあります。

jQuery CompareWYW pluginでは左右の写真は別々に設定するので、同じ場所を全く違う季節に撮影して並べたり、髪を切る前と後の比較などで使っても面白いかも知れません。アイディア次第で色々な使い道が生まれそうです。

jQuery CompareWYW pluginはjQuery/JavaScript製のオープンソース・ソフトウェアです。


MOONGIFTはこう見る

画像の差分表示には昔から様々な手法がとられています。ごく単純に言えばピクセル単位で比較して、違っている場所だけ残すという手があるでしょう。全く同じサイズ、殆ど違わない前提であればこれでも良いかも知れません。しかしテキストの差分は行を飛んでいる場合もマッチングさせますので、同様の機能が画像でも欲しい所です。

サイズの多少の違いは吸収したり、差分の程度によって許容範囲が設定できたりすると面白いかも知れません。特にJPEGは圧縮率によって状態が多少変わってくるので有効でしょう。似通っている画像、特徴的なオブジェクトを検出技術など画像にはまだまだたくさん面白いチャンスが眠っているはずです。

via Jquery Comparewyw - A jQuery plugin which allows you to compare image

jquery-comparewyw - a jQuery plugin which allows you to compare, for example, before and after images - Google Project Hosting

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2