jQueryプラグインcomponent.jsとHTML5のcanvasを使った、画像のリサイズと切り抜きです。

• 画面に表示されている加工用画像の四隅の赤い四角をドラッグすると拡大縮小ができます。
• このとき、「Shift」を押しながらドラッグすると、縦横の比率を維持します。
• 画面中央の赤いラインの四角（196pxの正方形）がこのサンプルの切り抜きサイズです。
• 拡大縮小をしながら画像のほうをドラッグして、切り抜きの位置を決めます。
• 位置が決まったら、[Crop]ボタンをクリックして切り抜きます。

切り抜かれた画像は別タブまたは別ウィンドウに表示されます。この画像をデスクトップなどへドラッグすれば、加工処理した画像としてそのまま利用できます（フォーマットはpng）。