HSPポータル
サイトマップ お問い合わせ


HSPTV!掲示板


未解決 解決 停止 削除要請

2021
0304
youdaiHGIMG4でキューブ環境マッピングシェーダーを実装したい6未解決


youdai

リンク

2021/3/4(Thu) 23:35:02|NO.92409

HGIMG4でキューブ環境マッピングシェーダーを実装したいです。

以下のようなシェーダーを作成しましたが、実際に動作させてみると
表面が真っ黒に表示されるだけでした。

シェーダーは wgld.org のキューブ環境マッピングを参考にしています。

・obj.material は、objというGPBモデルに対する.materialだと思って下さい。
・cubemap.png は、sampleのpronama3dフォルダの cubemap.png です。

cubemap.vert


attribute vec3 a_position; attribute vec3 a_normal; uniform mat4 u_worldMatrix; uniform mat4 u_worldViewProjectionMatrix; varying vec3 v_Position; varying vec3 v_Normal; void main(){ v_Position = (u_worldMatrix * vec4(a_position, 1.0)).xyz; v_Normal = (u_worldMatrix * vec4(a_normal, 0.0)).xyz; gl_Position = u_worldViewProjectionMatrix * vec4(a_position, 1.0); }

cubemap.frag


#ifdef OPENGL_ES #extension GL_OES_standard_derivatives : enable #ifdef GL_FRAGMENT_PRECISION_HIGH precision highp float; #else precision mediump float; #endif #else precision mediump float; #endif uniform vec3 u_cameraPosition; uniform samplerCube u_cubemapTexture; varying vec3 v_Position; varying vec3 v_Normal; void main(){ vec3 ref = reflect(v_Position - u_cameraPosition, v_Normal); gl_FragColor = textureCube(u_cubemapTexture, ref); }

obj.material


material cubemap { u_worldMatrix = WORLD_MATRIX u_worldViewProjectionMatrix = WORLD_VIEW_PROJECTION_MATRIX u_cameraPosition = CAMERA_WORLD_POSITION sampler u_cubemapTexture { mipmap = true wrapS = CLAMP wrapT = CLAMP minFilter = LINEAR_MIPMAP_LINEAR magFilter = LINEAR } renderState { cullFace = true depthTest = true } technique { pass { vertexShader = res/shaders/cubemap.vert fragmentShader = res/shaders/cubemap.frag } } } material mat1 : cubemap { sampler u_cubemapTexture { path = res/cubemap.png } }

textureCubeがHGIMG4でサポートされていないのかなと思って調べたのですが、
HGIMG4のskyboxシェーダーの skybox.frag に


uniform samplerCube u_diffuseTexture;

がありました。

また.hsのgpmatprmtにも


optパラメーターに、GPOBJ_MATOPT_CUBEMAPを指定した場合は、テクスチャをキューブマップとして扱います。 キューブマップは、6面方向の画像をまとめた特殊な形式で環境マップやスカイボックスなどに利用することができます。 (キューブマップ画像は、+X,-X,+Y,-Y,+Z,-Z放送の6画像を縦に連結した1枚の.PNG形式を使用してください。)

という記述がありました。

つまり、HGIMG4ではキューブ環境マップの機能がすでに備わっていて、
samplerCubeは使えるのではないかと思いました。

ちなみに、この cubemap.vert と cubemap.frag シェーダーを動作させた際に、
エラーログは出ませんでした。

.material のsamplerの項目名を破れかぶれにsamplerCubeに変更してみても結果は同じでした。

なんとなく、.materialのどこかにGPOBJ_MATOPT_CUBEMAPに該当するような
コマンドを指定しないといけないのかなぁと思うのですが、
どこに何を指定すればいいか分かりませんでした。
もしくは、それとは全く関係ないことなのかもしれません。

どう改善すればよいかご存じの方がいらっしゃいましたら、ぜひご指南お願い致します。



この記事に返信する


法貴優雅

リンク

2021/3/6(Sat) 00:36:35|NO.92416

失敗作(何かおかしい)ですが、とりあえず参考になるかも?
cube.vert

// Atributes attribute vec4 a_position; attribute vec3 a_normal; attribute vec2 a_texCoord; // Uniforms uniform mat4 u_worldMatrix; uniform mat4 u_worldViewProjectionMatrix; uniform vec3 u_cameraPosition; // Varyings varying vec3 v_pos; varying vec3 v_nml; varying vec3 v_eye; void main() { v_pos = (u_worldMatrix * a_position).xyz; v_nml = (u_worldMatrix * vec4(a_normal, 0.0)).xyz; v_eye = u_cameraPosition; gl_Position = u_worldViewProjectionMatrix * a_position; }

cube.frag

precision mediump float; // Uniforms uniform samplerCube u_diffuseTexture; // Varyings varying vec3 v_pos; varying vec3 v_nml; varying vec3 v_eye; void main() { vec3 ref = reflect(v_pos - v_eye, v_nml); gl_FragColor = textureCube(u_diffuseTexture, ref); }

obj.material

material textured { u_cameraPosition = CAMERA_WORLD_POSITION u_worldMatrix = WORLD_MATRIX u_worldViewProjectionMatrix = WORLD_VIEW_PROJECTION_MATRIX sampler u_diffuseTexture { mipmap = true wrapS = CLAMP wrapT = CLAMP minFilter = LINEAR_MIPMAP_LINEAR magFilter = LINEAR } renderState { cullFace = true depthTest = true } technique { pass { vertexShader = res/shaders/cube.vert fragmentShader = res/shaders/cube.frag } } } material blinn1 : textured { sampler u_diffuseTexture { path = cubemap.png wrapS = REPEAT wrapT = REPEAT } }

cubemap.pngはhsp36b5\sample\pronama3d\resの中にあるやつです。



法貴優雅

リンク

2021/3/6(Sat) 01:07:13|NO.92417

cube.fragの
vec3 ref = reflect(v_pos - v_eye, v_nml);

vec3 ref = v_nml;
にした方が、見え方が正しいのかも?
もうちょっと検証しないとわからないですが。



youdai

リンク

2021/3/6(Sat) 17:27:54|NO.92424

アドバイスありがとうございます。
頂いたシェーダーを試してみましたが、自分の環境では表面が真っ黒に表示されるだけでした。

キューブ環境マッピングのイメージとしては、
参考元の wgld.olg のサンプル画像のようなシェーダーをイメージしています。

wgls.olg - キューブ環境マッピング

https://wgld.org/d/webgl/w044.html

HGIMG4のsampleのskyboxシェーダーが動くのだから、samplerCube自体は使えるはずなのですが、
なぜ真っ黒に表示されるのかは理由は分かりませんでした。



youdai

リンク

2021/3/6(Sat) 17:30:25|NO.92425

参考元のホームページ名が間違っていました。

wgls.olg - キューブ環境マッピング

ではなく、正しくは

wgld.olg - キューブ環境マッピング

です。



法貴優雅

リンク

2021/3/6(Sat) 18:22:52|NO.92427

私の環境でも、真っ暗に表示されることがありましたが
今は普通に動いています、グラフィックボードかメモリか
何か環境の問題があるかもしれません。

キューブ環境マッピングを動かした感じは↓です。
https://twitter.com/MYAOSOFT/status/1367867299802181636

ちなみに私の環境は
OS:Windows10Pro
CPU:i5-3470
MEM:8GB
GPU:GT1030
です。



youdai

リンク

2021/3/7(Sun) 17:55:07|NO.92433

●キューブ環境マップについて
samplerCubeではなく、sampler2Dを使って幾何学的に
環境マップを実装する方法で試したところ上手くいきました。
なので質問としてのこのスレッドは、未解決という形ですが終了したいと思います。

●samplerCubeの使用について
samplerCubeを使ってHGIMG4でシェーダーを実装した場合、
環境によっては性能がsamplerCubeを満たしていても、映らない可能性があります。

色々実験してみた上での仮説です。

前提
・自分のPCではsamplerCube自体は有効

実験結果
・skyboxは有効
・samplerCubeを用いた自作シェーダーでGPBモデルを表示すると表面が真っ黒に表示される

仮説
・samplerCubeを用いたシェーダーでskybox以上の頂点数のモデルを表示すると異常が起きる?
・samplerCubeを用いたシェーダーでGPBモデルを表示すると異常が起きる?

シェーダーについてはsamplerCubeを用いて環境マップ以外の様々な種類のシェーダーを試してみましたが、
どれも表面は真っ黒でした。

非常にシンプルな構造のシェーダーでも試してみたのですが、結果は同じでした。
HGIMG4とsamplerCubeの組み合わせは、自分のPC環境とは相性が悪いようです。

今回のことで思ったのですが、自分と同じ現象が起きる環境が他にもあると思います。
samplerCubeを用いたシェーダーを実装するのは、
どうしてもそれ以外で作る方法がない場合を除いて避けた方がいいと思いました。



記事削除

記事NO.パスワード
(質問が解決したスレッドは他の利用者に活用してもらうため、削除しないようお願いします)

NO.92409への返信

マスコット

好きなマスコットを選んでください。

名前

e-mail
HOME
  1. 初めて利用する方は、HSP3掲示板の使い方をお読みください。
  2. 不要部分の多い長いスクリプトの投稿は ご遠慮ください。
  3. 書き込みは自動改行されません。適度に改行を入れてください。
  4. スクリプトは小文字の<pre>〜</pre>で囲むと見やすく表示できます。

削除用パスワード

解決したら質問者本人がここをチェックしてください。

エラー発生時、再送信すると二重送信になることがあります。
回答が得られたら、お礼書き込み時に[解決]チェックしてください。
SPAM防止のためURLから始まる文章は投稿できません。
SPAM防止のため英文字のみの本文を投稿することはできません。

ONION software Copyright 1997-2021(c) All rights reserved.