OpenGL描画→OpenCV処理→ピクチャボックス描画

#背景 画像処理シミュレータを作成しようとした際、下記のような悩みを持ったことはないだろうか。<br /> - カメラも画像処理をする対象も準備するのはお金かかるし、シミュレーションで検証できないかな。 - じゃあOpenGLで仮想世界を作ってみよう。 - OpenGLでレンダリングした画像をOpenCV側の画像に変換すれば画像処理ができるな。 - その結果をツールに表示したいな。色々検証したいからGUIも使えたら便利そうだな。 少なくとも私はしたいと思いました。<br /> これまでいくつか書いた記事は、これを実現するためのものでした。フォームアプリはまったくの初心者だったので、試行錯誤でようやくそれっぽいものを実現しました。<br /> ようやくフローが分かってきたので、一旦まとめようと思います。今回は実装ではなく、概念の部分です。実装は過去の記事で補完するものとします。<br /> #OpenGL→ピクチャボックス あれ、OpenCVは？と思いますが、まずはここを理解する必要があります。まずは次の図を見てみます。<br /> <a class="detailOn" href="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669c74696.png" id="i12976104839"><img alt="O" src="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669c74696.png" id="1403000325203" ratio="1.3008130081300813" style="border: none; height: 307.5px; width: 400px;" /></a><br /> <span style="line-height: 1.5;">過去に一部を示しましたが、簡単におさらいします。大きく分けて２段階の処理に分かれます。初期処理と逐次処理です。</span><br /> <ul> <li><i>初期処理</i></li> OpenGLで描画する際にはフォームのピクチャボックスのハンドルからレンダリングコンテキストを取得する必要があります。<br />→<a href="http://morimoridiary254.blogspot.jp/2016/01/ccli-openglgui.html" target="_blank" title="">C++/CLI フォームアプリとOpenGLの連携（フォームへのレンダリングとGUI操作）</a><br /> <li><i>逐次処理</i>（※動画にしたい場合。静止画なら１回でいいです。）</li> 描画対象のレンダリングコンテキストをカレントにし、OpenGLでバッファにレンダリングします。ただし、私の場合、ダブルバッファモードですのでレンダリングした画像はまだVRAMではない他のメモリに格納されており、ピクチャボックスに反映されません（<span style="color: red;">オフスクリーンレンダリング</span>）。<br />　これをSwapbuffers()で入れ替えて、晴れてピクチャボックスに表示されます（<span style="color: red;">オンスクリーン化</span>）。<br />　これをTimerなりで設定して繰り返し行えば動画が表示されます。　</ul> なお、オフスクリーンレンダリングの説明記事としては、次のサイトが分かりやすかったです。<br /> <a href="http://sonson.jp/?p=60" target="_blank" title="">sonson@Picture&Software－[OpenGL] オフスクリーンレンダリング</a><br /> ※ちなみに、オンスクリーンレンダリングは直接ピクチャボックスの領域に書き込むことを指します。描画の過程まで表示されるので描画の量が多いと画面がちらつきます。<br /> <br /> #OpenGL→OpenCV→ピクチャボックス OpenGLで描画できましたが、私がやりたいのはこれだけではありません。OpenGLでレンダリングした画像を<span style="color: red;">表示させず</span>に、OpenCVで処理した結果だけをピクチャボックスに表示したいのです。ここで、上述した<span style="color: red;">オフスクリーンレンダリング</span>が役に立ちます。<br /> <span style="line-height: 1.5;">下の図は先ほどの図にOpenCVの処理を追加したものです。先ほどと同様に説明をします。</span><br /> <a class="detailOn" href="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669d77d11.png" id="i12976105091"><img alt="O" src="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669d77d11.png" id="1403001197254" ratio="1.3008130081300813" style="border: none; height: 307.5px; width: 400px;" /></a><br /> <ul> <li><i>初期処理</i></li> OpenGLでレンダリングする場合とまったく同じです。OpenGLでピクチャボックスに書き込むわけではないのですが、どちらにしてもピクチャボックスからウィンドウハンドルを取得し、それからデバイスコンテキストを取得しなければなりません。デバイスコンテキストはどこからともなく沸いて出てくるものではないようです。<br /><span style="line-height: 1.5;">（ピクチャボックスに限らず、何らかのウィンドウハンドルを取得できればいいとは思いますが、わざわざ余計なことを考えることもないでしょう。ピクチャボックスから取得すればウィンドウサイズも同一ですし。）</span> <li><i>逐次処理</i>（※動画にしたい場合。静止画なら１回でいいです。）</li> 先ほどオフスクリーンレンダリングをしたイメージバッファをcv::Matのイメージバッファにコピーします。<br />→<a href="http://morimoridiary254.blogspot.jp/2016/01/ccli-opencvcvmat.html" target="_blank" title="">C++/CLI フォームアプリとOpenCVの連携（cv::Mat）－【1. OpenGL画像をOpenCV画像(cv::Mat)に変換】</a></ul> <ul><span style="line-height: 1.5;">　コピーしたら画像処理を好き勝手します。OpenCV画像処理の解説は他の有用なサイトを参照ください。</span></ul> <ul>　cv:MatのイメージバッファをBitmat形式に変換し、ピクチャボックスに描画します。Windowsのフォームに書き込もうと思ったら、Bitmapオブジェクトの利用は避けられません。<br />→<a href="http://morimoridiary254.blogspot.jp/2016/01/ccli-opencvcvmat.html" target="_blank" title="">C++/CLI フォームアプリとOpenCVの連携（cv::Mat）－【3. 結果画像(cv::Mat)をフォームのピクチャボックスに表示】</a><br /><br />　注意点ですが、OpenCVのバッファを表示する際はSwapBuffursは行ってはいけません。短時間のうちにOpenGLの画像とOpenCVの画像が高速に切り替わり画面がちらつきます。表示させるのは目的に応じてどちらか一方にしましょう。</ul> #まとめ 手順は以上です。<br /> これまであれが足りないこれが足りないと一個一個調べて作っていたものが、ようやく１つのループになりました。<br /> 下記画像の①、②については過去の記事でサンプルを公開しています（上記説明で前述ですが、まとめとして書きます）。<br /> ①：ウィンドウハンドルからレンダリングコンテキストを習得<br /> 　　→<a href="http://morimoridiary254.blogspot.jp/2016/01/ccli-openglgui.html" style="line-height: 1.5;" target="_blank" title="">C++/CLI フォームアプリとOpenGLの連携（フォームへのレンダリングとGUI操作）</a><br /> ②：OpenGLのイメージバッファをOpenCVのイメージバッファにコピー<br /> 　　OpenCVのイメージバッファをピクチャボックスに表示<br /> 　　→<a href="http://morimoridiary254.blogspot.jp/2016/01/ccli-opencvcvmat.html" style="line-height: 1.5;" target="_blank" title="">C++/CLI フォームアプリとOpenCVの連携（cv::Mat）</a><span style="text-decoration: underline;"><br /></span><br /> <a class="detailOn" href="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669ec4df1.png" id="i12976105224"><img alt="O" src="http://blog-imgs-86.fc2.com/m/o/r/morimoridiary254/blog_import_568b669ec4df1.png" id="1403000292920" ratio="1.3008130081300813" style="border: none; height: 307.5px; width: 400px;" /></a><br /> <span style="line-height: 1.5;">これで少しは遊べるようになりました。</span><span style="line-height: 1.5;"><br />余談ですが、C#に興味はありましたが無理に使う必要はなさそうですね。C++に対するC#のメリットはWebや通信関係を便利にするくらいだと思います。C++でもGUIはフォームで簡単に作れますし。</span><br /> 会社で今度C#のセミナを受けさせてもらうことになったので、気が向いたら投稿しようと思います。<br />それでは。<br /> <br />