Jcropを使ってブラウザ上で画像を範囲指定して切り抜き(トリミング)

2014/06/27

やりたかった事は、画像をアップロードして必要な部分のみを範囲指定してもらい、指定した部分を別の画像として保存したかった。

画像の保存とかアップロードはいけるんだけど、範囲指定してトリミングする部分をJcropというjQueryのプラグインを用いることでなんとかなりそう。

Jcrop

サンプル

基本的にはそのまま使えそうなんだけど、比率が決められちゃってる？　なんと言えばいいんだろう……こう、長方形型に切り抜きたいとかあるじゃないですか。

そういう場合は

aspectRatio: 1

1	aspectRatio: 1

の部分取り外したらいけた。

あとは、

imagejpeg($dst_r,'hogehoge.jpg');

1	imagejpeg($dst_r,'hogehoge.jpg');

とかで保存しちゃえばいい。

画像が切り替わらないとかはキャッシュ確認。

: javascriptやjQueryで画像を書き換えても変わらない場合

けっこう前に画像をアップロードしてリアルタイムにプレビューする機能を作った時に ...

: セレクトメニューにサジェスト機能をつける(select2)

formのselectメニューで何文字が入力すると候補を絞って表示させるサジェス ...

: jQueryでjsonデータを処理(parseJSON)

他社が作成したシステムのちょっと改修案件があった。設置したもののどうも動かないと ...