CANマルチゲージの製作(2) - Audi R8編

　DWINが提供している「DGUS」（DWIN Graphic Utilized Software）というGUIツールを使って、モニターモジュールに実装された、様々な機能を編集することができます。

　せっかくなので、イグニッションをONにすると、このような感じで、オープニングアニメーションが表示されるようにしてみようかと。

　オリジナルの動画は、この印象的な「Audi R8 V10 Plus」のCMから、パチったものです。

＃このCM、初めて観た時は、本当に度肝を抜かれたものです。0xF9CF

　で、ですね。

　このオープニングアニメーションを編集している間に思い付いたのですが、せっかくなので、もう少しいじってみました。

（各メーターのデザインは、仮）

　元々、このCANマルチゲージは、「水温計」「油温計」「油圧計」「ブースト計」の4つを表示しようと考えていました。

＃なぜにNA（自然吸気エンジン）なのに「ブースト計」が必要なのかは、また別の機会に。

　ちょうど4つのメーターができるので、Audiの“Four Rings”を活かしてみることにしました。

　まずは、できるだけ解像度の高い“Four Rings”の画像を用意し、4つのリングをそれぞれ切り出します。

　切り出したリングは、一部が隣のリングと交わっており、その影響をできるだけ除くため、同心円（外円・内円）で必要な部分のみ切り出します。

　あとは、オリジナル画像の“Four Rings”の初期位置から、4つのメーターの最終位置まで、切り出した画像を合成しながら移動させます。

　画像の合成は、「OpenCV」（4.12.0）に、「Visual Studio 2026」を使用しています。

　基本的には、画像の幾何変換（warpAffine()関数）を使って移動・拡大（縮小）していますが、単純に画素の色情報を使って合成しても、不自然な画像になってしまうことが分かりました。

　オリジナル画像の“Four Rings”は、当然ながら、きちんとした3Dモデルがあって、これをレイトレーシングでレンダリングしているため、鏡面状のリングに、隣のリングが映り込んでいるなど、複雑な画像となっています。

　3Dモデルを起こして、同じようにレンダリングすればよい訳ですが、マテリアルの設定に加え、間接光や環境光の設定など、多数の要素が複雑に要素が絡むため、オリジナルに近い画像を得るためには、相当な苦労が予想されます。

　そこで、ちょっと工夫してみました。

　擬似的に、リングの形状を模した画像を作り、これをαチャンネルに格納し、4つの画像を合成することにしました。

　αチャンネルの「輝度」を、3Dモデルの「高さ（厚み）」に相当するものとし、輝度（高さ）が大きい方の色情報を採用することで、リングが重なり合った位置の色情報が不自然にならないようにしてみました。

　αチャンネルを使っていますが、いわゆる一般的なαブレンディングとは異なり、オリジナルの関数を書いています。

　なお、画像の合成にあたっては、一旦、元の画像の2倍のサイズの画像を作り、それらを重ね合わせた後、画素の周囲の色情報の平均値を取って縮小（1/2倍）することで、ジャギーの目立たない画像（擬似的なアンチエイリアシング）としています。

　つぎに、リングのベゼルに見える、不要な凹凸を消してみます。

　この凹凸は、見て分かるとおり、隣のリングと重なった位置にできています。

　よって、2つ（または3つ）のリング同士を重ね合わせ、それらの「AND（論理積）」の位置にある画素を補正すればよい訳ですが、単純に画素の色情報の比較だけでは、不自然な画像になってしまうことが分かりました。

　そこで、ここでも、リングの形状を模した、αチャンネルの情報を使ってみました。

　リング同士の重なりを、αチャンネルの論理積で検出し、かつαチャンネルの輝度が大きい、すなわち高さが高い方の位置にある画素を、補正対象としてみました。

　画像の中で、赤色になっている位置の画素が、補正対象としている画素となります。

（各メーターのデザインは、仮）

　今でこそ、AIにプロンプトを与えれば、簡単に画像補正や動画作成ができる世の中になりました。

　しかし、オリジナル画像に対し、内部でどのような処理が行われているのかが分からないのが“気持ち悪い”ため、昭和なエンジニアは、シコシコとプログラムを書いて解決しました。0xF9F8

（つづく）