令和ドローの裏側１、PNG画像の一部分を削除する

「令和」とてもいい元号だと思います。おめでとうございます🎉

そして、平成ドローの令和バージョン、令和ドロー作りました。

令和コラ作成ツール作りました😇
新しい時代の始まりに面白コラ量産しましょう👍https://t.co/p4h1bxjip9 pic.twitter.com/088Gw4DahG
— 升 (@walkingmask) April 1, 2019

リポジトリも公開しています。flaskのbuilt inサーバー使ってるの、やばいよって言う人がいたら教えてください。

ツイートでは切り抜きの縁がギザギザしてますが、アップデートしてアンチエイリアス効かせるようにしました。

二番煎じで、元号発表直後と言うこともあってか、平成ドローのバズり具合に比べると全然勢いがなくてちょっと寂しいです。

それはさて置いて、令和ドローは平成ドローから以下のようなアップデートを施しました（一部平成ドローにも適用済み）。

SkyBlue CSS Frameworkを使用してUIをアップデート
ヘルプページの追加
ノリで広告の追加（GWが近いので個人的にお世話になっている楽天トラベルを）
プログレスバー表示
モバイルからもダウンロード可能に
- base64からBlobURLに変更
- これが実現できるgifライブラリに変更しただけ
生成に使用するcropped画像生成作業半自動化スクリプト
- フレームサイズ変換、フレームスキップ
- 合成領域の頂点を画像クリックしてくだけでjson出力
- フレームから合成領域を削除してPNG画像として出力

特に、最後の合成領域の削除は、今後も使えそうなテクニックだったので記録したいと思います。

cv2.fillConvexPoly

cv2.fillConvexPoly(img, points, color[, lineType[, shift]])

cv2.fillConvexPolyは画像imgにpointsを頂点とした図形を描画するopencvの関数です。

Drawing Functions — OpenCV 3.0.0-dev documentation

これを使って、RGBのフレームを次のように変換します。

alpha = np.ones(frame.shape[:2] + (1,), dtype=np.uint8) * 255
cv2.fillConvexPoly(frame, points=points, color=(0, 0, 0), lineType=cv2.LINE_AA)
cv2.fillConvexPoly(alpha, points=points, color=(0), lineType=cv2.LINE_AA)
frame = np.dstack((frame, alpha))

frameと同じサイズのalphaというarrayを作って、それぞれにfillConvexPolyで図形をcolor=0で描画します。そしてframeとalphaをstackすることでPNG画像としてはその部分を「削除」したことになります。

cv2.LINE_AAがアンチエイリアスを効かせている部分になります。

削除と言わずとも、画像のマスク等にも使えそうですね。