JTrimで斜めにカットした画像を合成する! 

斜めにカットできれば簡単だけど…


JTrimで斜めにカットした画像を合成する!

見かけることも多い対角線上に分割された2つの画像の合成画像、簡単にできそうな感じもするけど…やろうとすると三角形にトリミングした画像をペイントとかに張り付けて合わせるだけでできるじゃん!って思うのだが、三角形にトリミングできるアプリケーションがない?ある?私は見たことがない。

四角形には簡単にトリミングできるので上下や左右の合成は出来上がりの綺麗さは別としても誰でも簡単にできるであろう。

JTrimでその斜めにカットができるのかというとそうではなく、斜めに明るい場所と暗い場所を確立しておき、暗いほうに別の画像を合成するという感じになる。

二つの画像を用意する

JTrimで斜めにカットした画像を合成する! JTrimで斜めにカットした画像を合成する!

斜めに明るい方(犬や猫の画像)と暗い方に分割する。

JTrimで斜めにカットした画像を合成する! JTrimで斜めにカットした画像を合成する!

犬の暗い方に猫の画像を明るい部分を優先して合成すると両方の明るい部分だけが残って完成するという感じ。

ただ、二つの画像サイズが違う状態で作業してしまうと

JTrimで斜めにカットした画像を合成する!

こんな感じにズレてしまうのは想像はつくと思います。今回は簡易的にですが画像サイズを合わせるところから説明していきます。

スポンサードリンク

 

画像を右クリックして編集で開きます。下の画像は犬と猫の画像をそれぞれペイントで開いた状態ですが1つづつ作業しても問題ありません。

ここでの作業の画像サイズと被写体の位置取りを綺麗に仕上げたい場合は別途どこかでやり方を探してください(笑)

画像サイズを合わせる

画像サイズを合わせるだけというならばWindows標準のペイントでできます。今回はWindows10のペイントを使用しています。

JTrimで斜めにカットした画像を合成する!

ペイントのメニューのプロパティを開きサイズを指定します。今回は600*600にしています。

JTrimで斜めにカットした画像を合成する!

そのままだと犬の方が顔が半分切れてしまいそうなのでコピーとペーストで右下の方へずらしています。猫の方は白い部分が多すぎるのでコピーとペーストで張り付けた後に画像をキャンパスくらいまで広げています。この際に画像を広げて荒くなるようならキャンパスサイズをもっと狭くするしかないですかね。
画像の端の余計な部分や余白の部分は周りの背景をコピーペーストして適当に埋めておきます。端っこの部分なので適当な感じでも出来上がりではあまり目立たないですが、綺麗に仕上げたいのであればPhotoshopとかで綺麗にできるのかな?たぶん

JTrimで斜めにカットした画像を合成する!

これで2つのサイズが同じになったので出来上がりでズレまくってしまうことはないでしょう。



JTrimで合成

まずは犬の方の画像から作業します。出来上がりでは右下に犬の顔が残ります。

JTrimで犬の画像を開きメニューの[カラー] - [グラデーション]を開きます。
色1に黒を指定、色2に白を指定
グラデーションの方向は左上から右下
不透明度は100%
でOKを押します。

JTrimで斜めにカットした画像を合成する!

次にメニューの[カラー] - [2階調化] を開きます。
境界のしきい値を127にしてOKを押します。

JTrimで斜めにカットした画像を合成する!

これで600*600のサイズの斜めに分割された明暗部分が作成できました。犬の画像を開いたのは600*600のサイズを利用するためだけなので、犬の画像は使わずに新規作成でキャンパスを作成してから作業をしても問題ありません。

JTrimで斜めにカットした画像を合成する!

次は、この白黒キャンパスの白い部分に犬の画像を入れます。
メニューの[編集] - [合成]を開きます。
合成する画像ファイルに犬の画像を開きます。
構成方法は暗い画素優先を選択してOKを押します。

JTrimで斜めにカットした画像を合成する!

これを保存して犬の画像の準備は終了です。

JTrimで斜めにカットした画像を合成する!

次は猫の画像の作業をします。やる作業は犬の画像の方と全く同じですが、猫の画像は左上になるので明暗の設定だけは逆になります。

猫の画像をJTrimで開いてグラデーションメニューを開きます。
今度は色1に白を色2に黒を指定します。
グラデーションの方向は左上から右下
不透明度は100%

JTrimで斜めにカットした画像を合成する!

2階調化メニューで境界のしきい値を127にしてOKを押します。
メニューの[編集] - [合成]を開き、合成する画像ファイルに猫の画像を選択して開きます。

JTrimで斜めにカットした画像を合成する!

猫の画像は保存して、次は犬の画像を開きます。
犬の画像の黒い部分に猫の画像を合成します。

メニューの[編集] - [合成]を開き、合成する画像ファイルに猫の画像を選択します。
合成方法は明るい画素優先を指定してOKを押します。

JTrimで斜めにカットした画像を合成する!

2つの画像の明るい方が優先されて合成され完成です。

JTrimで斜めにカットした画像を合成する!

おしまい!

スポンサードリンク

この記事へのコメント

Re:JTrimで斜めにカットした画像を合成する!

>三角形にトリミングできるアプリケーションがない?ある?

面白そうなので同じように加工してみました。

>画像サイズを合わせる
まではそのまま同じ作業でいいみたいですね。

犬、猫の画像を同じサイズにして

>JTrimで合成
イメージ: 余白を作成します。
猫の画像にさらに上下左右に余白を作成します。
(回転後の上半分を切り抜き易くする為)

イメージ: 任意角度調整します。(正方形なら45度)
回転後、別名で保存します。(□に入った△画像)


犬の画像に同じく上下左右に余白を作成します。
右45度回転後の下半分を切り抜きます。

犬の画像(□に入った▽画像)が出来あがり
その画像の上に猫の画像(□に入った△の画像)を連結します。

編集: 連結します。

連結: 連結する画像ファイル: ...ボタンで
別名で保存した猫の画像を選択します。(連結方法は、◎上へ)

イメージ: 任意角度調整で角度を戻します。

切り抜きで完成しました。

Re: Re:JTrimで斜めにカットした画像を合成する!

こんばんわ

角度調整することもできたんですねしらなかったです。

ちょっとやってみました、切り抜きした部分は三角形になりますが、画像としては四角形なので連結したら重ならなくないですか?
「それぞれ切り抜きします」がちょとわからないですが、もしかして、連結して回転させて斜めカットになったところを切り取るってことですかね?

しかし、この角度調整は使えますね。
  • [2017/02/07 01:41]
  • URL |
  • 管理人わーとん
  • [ 編集 ]
  • TOP ▲

Re:JTrimで斜めにカットした画像を合成する!

[2017/02/06 23:50]のコメントを修正しました。

接合面の微調節は、

編集:元に戻す 
連結時に左端からずらす量:で調節出来るみたいですね。

Re: Re:JTrimで斜めにカットした画像を合成する!

こんばんわ

詳しい説明ありがとうございます。
三角にトリミングできなくても三角の部分をくっつけてから45度回転させて出来上がりを切りぬくって感じですね!

こっちのほうがセンスがいりそうですが、スマートで作業的にも早いですね。
ありがとうございました。
  • [2017/02/09 20:27]
  • URL |
  • 管理人わーとん
  • [ 編集 ]
  • TOP ▲

Re:JTrimで斜めにカットした画像を合成する!

説明が、下手でごめんなさい。

猫の画像では、
回転後、上半分を切り抜き別名で保存します。(□に入った△画像)

別名で保存の回転を戻せば、
結果として三角形にトリミング?みたいなモノかもしれません。

Re: Re:JTrimで斜めにカットした画像を合成する!

こんばんわ

大丈夫です、私はやってみてできたので分かったと思います…たぶん。
  • [2017/02/11 01:24]
  • URL |
  • 管理人わーとん
  • [ 編集 ]
  • TOP ▲

コメントをお寄せ下さい

(コメント編集・削除に必要)
(管理者にだけ表示を許可する)

トラックバック

この記事のトラックバックURL
http://z0001.blog87.fc2.com/tb.php/436-218fd140