面白い！JavaScript+Canvasによる画像差分表示·JS-ImageDiff MOONGIFT
JS-ImageDiffはJavaScript+Canvasタグを使って二つの画像の差分表示を行うライブラリです。 GitHubでは差分をWebブラウザ上で閲覧できますが、その時に画像の差分表示も行えるのを知っているでしょうか。スライダーで動かしたりして差分を確認できるのですが、その一つの差分表示をオープンソースで再現するのがJS-ImageDiffです。 サンプルです。上が元、中間が変換後そして下が差分となります。どこが違うのか一目で分かります。 左が影無し、右が影ありです。一致している部分だけが表示されています。 サイズが違う場合の差分表示です。 JS-ImageDiffはCanvasタグを使って画像を読み込み、その差分を表示しています。各ピクセル単位で画像を比較して同じであれば黒、違う場合はうまく表示するというやり方でここまで見事に表示できるのが面白いですね。 JS-ImageDif
ドラッグ＆ドロップできる地図を実装できる3KBの軽量JSライブラリ「SpryMap」:phpspot開発日誌
SpryMap - lightweight javascript click and drag map script | candrews.net ドラッグ＆ドロップできる地図を実装できる3KBの軽量JSライブラリ「SpryMap」。 JSだけなら3KBで記述された軽量なスクリプトになっています。jQuery等のライブラリにも依存していないので手軽に使うことが可能。 こうしたライブラリは他にもありますが、ここまで軽いのはなかなかないかもしれませんね。 jQueryを使っていませんが次のように非常に使いやすい物になっています。 関連エントリ Googleマップを使った経路案内も一瞬で実装できるjQueryプラグイン「jGmaps」 GoogleマップAPI ver3でGoogleマップを独自にスタイルすることが出来るらしい Googleマップ風のUIを実現できるJSライブラリ「Polymap
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Link | 関連情報 | study-room
