レッスン78
2枚の画像を合わせてみよう⌗
やること⌗
●2枚の画像をならべてつなげる
●2枚の画像を手動で重ねる
●2枚の画像をプログラムで重ねる
この2つをやるときに、画像の大きさを変えたり、背景を透明にするやりかたも勉強します。
画像の準備⌗
使う画像をGoogleドライブからダウンロードする。
https://drive.google.com/drive/folders/1KfOD3nf98rHx-jnofnRf6A0o9c1GT98_?usp=drive_link
「miuraio99」アカウントの「レッスン78_2枚の画像を合わせてみよう」というフォルダの中にあります。
リンクを開いたら、ひとつ上のフォルダに移動して、「レッスン78_2枚の画像を合わせてみよう」フォルダを右クリックして、ダウンロードするといいと思います。
ダウンロードするとZIPファイルになるので、それを右クリックして展開しましょう。
2枚の画像をならべてつなげる⌗
月の画像とすっぽんの画像を横にならべて、月とすっぽんの画像を作る。
ImageMagickというコマンドツールを使うので、「レッスン78_2枚の画像を合わせてみよう」フォルダでターミナルを起動する。
ターミナルを起動するには「レッスン78_2枚の画像を合わせてみよう」フォルダを開いて、F4を押すと便利です。
2つの画像の幅と高さを確認する。
$ identify 月.png
月.png PNG 418x411 418x411+0+0 8-bit sRGB 193280B 0.000u 0:00.000
$ identify すっぽん.png
すっぽん.png PNG 669x588 669x588+0+0 8-bit sRGB 346187B 0.000u 0:00.000
identifyコマンド結果の3つ目の項目が幅と高さを表している。
高さが、月.pngは411で、すっぽん.pngは588と違うが、そのまま結合してみる。
$ convert 月.png すっぽん.png +append 月とすっぽん.png
月.pngとすっぽん.pngの高さが違うが、高い方に合わせてくれる。
ただし、高さが低い月.pngの下が透明ではなく白くなってしまう。
白い部分を次のコマンドで透明にする。
$ convert 月とすっぽん.png -transparent white 月とすっぽん透明.png
次は、すっぽんの高さを月と同じにしてから結合する。
高さを変えるコマンド
$ convert すっぽん.png -resize x411 すっぽんリサイズ.png
高さが変わったか確認
$ identify すっぽんリサイズ.png
すっぽんリサイズ.png PNG 468x411 468x411+0+0 8-bit sRGB 129480B 0.000u 0:00.000
高さがそろったので、結合する。
$ convert 月.png すっぽんリサイズ.png +append 月とすっぽん2.png
今度は、背景の一部が白くなることはない。
2枚の画像を手動で重ねる⌗
猫の画像と小判の画像を重ねる。
GIMPを使う。
「猫.jpg」をGIMPで開く。
次の手順で好きな猫を切り抜く。
左上の「矩形選択」をクリック
選ぶ猫をドラッグして四角で囲う。
囲った後もEnterで確定するまでは、角などをドラッグして範囲を修正できる。
囲う範囲が決まったらEnterを押して確定させる。
囲った部分で右クリック、編集→コピー(Ctrl+Cを押してもよい)
もう1回右クリック、編集→クリップボードから生成→画像(Ctrl+Shift+Vを押してもよい)
選んだ猫だけの画像が新しく作られる。
この後、背景を透明にする。
左上の「ファジー選択」をクリック
猫の画像の背景をクリック
これで背景の部分が選択される。ファジー選択は近い色の部分を選択してくれる。
右クリック、編集→消去(Deleteを押してもよい)
この後、小判の画像を追加する。
「ファイル」→「レイヤーとして開く」で小判.pngを選ぶ。
画像が大きいので、Ctrlを押しながらマウスホイールを動かして縮小する。
この後、小判を縮小する。
左上の「拡大・縮小」をクリック
小判の画像をクリック
四角をドラッグして縮小する。
Enterで確定させる。
移動させるときは、いったん縮小を確定させてから、左上の「移動」をクリックして、小判をクリックして、ドラッグする。
小判をコピーしたければ、小判を右クリック、レイヤー→レイヤーの複製
元と同じところに複製されるのでドラッグで移動させる。
画像を保存するときは、「ファイル」→「名前をつけてエクスポート」をクリックして、保存するフォルダを選んで、名前をつけて、「エクスポート」を押して、次の画面でもう1回「エクスポート」を押す。
次に、四角では囲えない画像を切り抜く。
GIMPを使う。
「猫2.png」をGIMPで開く。
次の手順で好きな猫を切り抜く。
左上の「自由選択」をクリック
線を引くようにドラッグして、好きな猫を囲う。
途中でやり直すときは、Escを押す。
囲う線が最初の点とつながるときに丸が出るので、そこでドラッグをやめて、Enterで確定させる。
後は、四角で囲ったときと同じように作業できる。
2枚の画像をプログラムで重ねる⌗
この画像は、ImageMagickを使って下記のコマンドを実行すると作れます。
composite -gravity center -compose add おじいさん.png 和風.png add-和風-おじいさん.png
好きな画像をネットで探したり作ったりして、それを重ねてみましょう。
「-compose」の後のオプションを変えると結果が変わります。使えるオプションは次のようなものがあります。‘multiply’, ‘screen’, ‘add’, ‘minus’, ‘difference’
いろいろな画像といろいろなオプションの組み合わせを試すのは面倒なのでプログラムを作りました。
「2枚の画像をプログラムで重ねる」フォルダの中の「blend_images.py」を使ってください。
プログラムの実行方法
ターミナルで「2枚の画像をプログラムで重ねる」フォルダに移動する。
次のコマンドを実行する。
python3 blend_images.py
プログラムを実行する前に、「画像」フォルダと「背景」フォルダに好きな画像を入れてください。
画像のダウンロードは下記のサイトが使いやすかったです。
いらすとや
https://www.irasutoya.com
SOZAI GOOD
https://sozai-good.com
プログラムを実行すると、「画像」フォルダの画像と「背景」フォルダの画像といくつかのオプションのすべての組み合わせで画像が作られます。
作られた画像は「合成画像」というフォルダの中にあります。