投稿

VL-BASICで動くレイトレーシング (3回目)

イメージ
2021/7/18(日) VL-BASICで動くレイトレーシング (3回目)   by ULproject   VL-BASICの拡張命令でレイトレーシングです CPUのみの計算で動いています   フォトンマッピングによる集光模様を表示してみました 移動はブースター方式 (宇宙船を操作している感覚)にし 裸眼立体視も表示してみました   blg~.zip(mray003v.bas)は 以下のリンクからダウンロードできます VL-BASIC(N88-BASIC互換?)ホームページ Readme.txtを読んで遊んで下さい   操作方法は hキーで表示されます

VL-BASICで動くレイトレーシング (2回目)

イメージ
2021/7/14(水) VL-BASICで動くレイトレーシング (2回目)   by ULproject   VL-BASICの拡張命令でリアルタイムレイトレーシング です CPUのみの計算で動いていますので コア数 (32スレッドまで)が多いほど速くなります   雪だるまとトーラス (ドーナツ)と鏡を配置し 移動はブースター方式 (宇宙船を操作している感覚)にし 裸眼立体視も表示してみました   blg~.zip(mray002v.bas)は 以下のリンクからダウンロードできます VL-BASIC(N88-BASIC互換?)ホームページ Readme.txtを読んで遊んで下さい   操作方法は hキーで表示されます

VL-BASICで動くレイトレーシング

イメージ
2021/7/10(土) VL-BASICで動くレイトレーシング   by ULproject   HTMLで動くレイトレーシング   を VL-BASICの拡張命令で作ってみました   VL-BASICは行列による移動になりますので mray003.html が一番近いです (VL-BASIC拡張命令では点の大きさの変更には 対応していませんので省略しています )   以下、モデル (球)の配置の説明 mray003.htmlのModel関数と同じように作りました   *MODEL GPU MATERIAL(PUSH) GPU MATRIX(MODE, MODEL) ' GPU MATERIAL(SPECULAR, 1.0, 1.0, 1.0) GPU MATERIAL(SHININESS, 10.0) GPU MATERIAL(REFLECT, 0.0, 0.0, 0.0) GPU MATERIAL(CLARITY, 0.0, 0.0, 0.0) GPU MATERIAL(REFRACT, 1.0) ' 光源 GPU MATERIAL(LIGHT    , 1.0, 1.0, 1.0) '--- 光源の光の色と強さ GPU MATERIAL(ATTENUATE, 1.0, 0.0, 0.0) '--- 光減衰(0,1,2乗の係数) GPU MATERIAL(DIFFUSE, 1.0, 1.0, 1.0) GPU MATRIX(PUSH) GPU TRANSLATE(-500, 500, 500) GPU SPHERE(2) GPU MATRIX(POP) GPU MATERIAL(LIGHT    , 0.0, 0.0, 0.0) '--- 光源の光の色と強さ ' 大球 GPU MATERIAL(DIFFUSE, 0.0, 1.0, 1.0) GPU MATRIX(PUSH) GPU TRANSLATE(3, 8, -80) GPU SPHERE(18) GPU MATRIX(POP) ' 小球 GPU MATERIAL(DIFFUSE, 1.0, 1.0, 0.0) GPU MATRIX(PUSH) GPU TRANSLATE(-6, 14, -60) GPU SPHERE(6) GPU MATRIX(P

HTMLで動くレイトレーシング

イメージ
2021/7/6(火) HTMLで動くレイトレーシング (1回目)~(4回目)   (by ULproject for HTML,JavaScript,canvas)   HTMLでレイトレーシング (8回目) HTMLで行列(matrix) (2回目) HTMLでクォータニオン(quaternion) (1回目) を使ってレイトレーシングを動かしてみました   HTML,JavaScript,canvasは、使い慣れていない ため、不具合などが多々あると思いますが、 ご了承ください   (1回目)~(4回目)のプログラムの説明   上記リンク先のプログラムをほぼそのまま結合 (1回目) mray001.html … 行列による移動 (2回目) mray002.html … クォータニオンによる移動   上記プログラムを OpenGL風インターフェースに改造 (3回目) mray003.html … mray001.htmlを改造 (4回目) mray004.html … mray002.htmlを改造   以下、モデル (球)の配置の説明   function model() {   var md;     Sn = 0;    // Model reset   md = Mode; // Push Mode   Mode = 0;  // Model mode     Specular(1.0);   Shininess(10.0);   Reflect(0.0);   Clarity(0.0);   Refract(1.0);     // 光源   Diffuse(1.0, 1.0, 1.0);   Push();   Translate(-500, 500, 500);   Sphere(2);   Pop();     // 大球   Diffuse(0.0, 1.0, 1.0);   Push();   Translate(3, 8, -80);   Sphere(18);   Pop();     // 小球   Diffuse(1.0, 1.0, 0.0);   Push();   Translate(-6, 14, -60);   Sphere(6);   Pop();     // 透明   Diffuse(0.1, 0.1, 0.1);   

HTMLでクォータニオン(quaternion) (2回目)

イメージ
HTMLでクォータニオン(quaternion) ( 2 回目 )   (by ULproject for HTML,JavaScript,canvas)   行列 (matrix)の代わりに四元数(しげんすう) (quaternion)を使用して見ました   今回はクォータニオンを行列に変換して ベクトルとの積を求めています       以後、四元数と行列を大文字、それ以外を 小文字で表します   このシリーズは、プログラム を 出来るだけ似せて 移植していますので、解説を省略しています 式などに関する説明も省略していますので 詳しくは N88-BASICでクォータニオン(quaternion) (2回目) を見てください   HTML,JavaScript,canvasは、使い慣れていない ため、不具合などが多々あると思いますが、 ご了承ください blg~.zip(quad002.html)は 以下のリンクからダウンロードできます VL-BASIC(N88-BASIC互換?)ホームページ Readme.txtを読んで遊んで下さい   動作は同じなので前回のHTMLのリンクと 行列での動画を貼っておきます quad001.htmlへのリンク 操作方法 //---------------------------------------------------------------------- //  1  2           |  1モデルモード 2ビューモード //                 | //  p  @  [  enter |  p左傾き    @上に移動  [右傾き   enter初期位置へ //  ;  :  ]        |  ;左に移動  :下に移動  ]右に移動 //                 | //    ↑            |          ↑機首下げ // ← ↓ →          | ←左旋回  ↓機首上げ  →右旋回 //                 | //  /  \(_)  +shift|  /後進  \(_)前進                +shiftで速く移動 //---------------------------------------------------------

HTMLでクォータニオン(quaternion) (1回目)

イメージ
2021/7/3(土) HTMLでクォータニオン (quaternion)  (1回目)   (by ULproject for HTML,JavaScript,canvas)   行列 (matrix)の代わりに四元数(しげんすう) (quaternion)を使用して見ました。     以後、四元数と行列を大文字、それ以外を 小文字で表します   このシリーズは、プログラム を 出来るだけ似せて 移植していますので、解説を省略しています 式などに関する説明も省略していますので 詳しくは N88-BASICでクォータニオン(quaternion) (1回目) を見てください   HTML,JavaScript,canvasは、使い慣れていない ため、不具合などが多々あると思いますが、 ご了承ください   JavaScriptでは、 Q[0]~Q[3]で回転四元数 Q[4]~Q[7]で並進四元数 として 複合四元数を表現しています blg~.zip(quad001.html)は 以下のリンクからダウンロードできます VL-BASIC(N88-BASIC互換?)ホームページ Readme.txtを読んで遊んで下さい quad001.htmlへのリンク 操作方法 //---------------------------------------------------------------------- //  1  2           |  1モデルモード 2ビューモード //                 | //  p  @  [  enter |  p左傾き    @上に移動  [右傾き   enter初期位置へ //  ;  :  ]        |  ;左に移動  :下に移動  ]右に移動 //                 | //    ↑            |          ↑機首下げ // ← ↓ →          | ←左旋回  ↓機首上げ  →右旋回 //                 | //  /  \(_)  +shift|  /後進  \(_)前進                +shiftで速く移動 //-------------------------------------------------------

HTMLで行列(matrix) (2回目)

イメージ
2021/7/2(金) HTML で 行列 (matrix)   (2 回 目 )   (by ULproject for HTML,JavaScript,canvas)     点を並進、回転移動させる行列を作り ワイヤーフレーム (線画)の立体を ラジコンや自分が移動する (1,2キーで切り替え、キー操作はプログラムの 最終行のコメントに書いています ) ように動かしていきます   このシリーズは、プログラム を 出来るだけ似せて 移植していますので、解説を省略しています 式などに関する説明も省略していますので 詳しくは N88-BASICで行列(matrix) (2回目) を見てください HTML,JavaScript,canvasは、使い慣れていない ため、不具合などが多々あると思いますが、 ご了承ください   ここから、行列は大文字、 ベクトルとスカラーは小文字で表す事にします 行列は 4×4(4行4列)とし、 ベクトルは 3次元(4次元目は常に1)とします またベクトル上部の矢印は省いています   JavaScriptでは行列Aの成分を、 |A[0] A[4] A[ 8] A[12]| |A[1] A[5] A[ 9] A[13]| |A[2] A[6] A[10] A[14]| |A[3] A[7] A[11] A[15]| で表す事にします   r 11  = n 1 n 1 +(1-n 1 n 1 )cosθ r 22  = n 2 n 2 +(1-n 2 n 2 )cosθ r 33  = n 3 n 3 +(1-n 3 n 3 )cosθ r 12  = n 1 n 2 (1-cosθ)-n 3 sinθ r 21  = n 2 n 1 (1-cosθ)+n 3 sinθ r 13  = n 1 n 3 (1-cosθ)+n 2 sinθ r 31  = n 3 n 1 (1-cosθ)-n 2 sinθ r 23  = n 2 n 3 (1-cosθ)-n 1 sinθ r 32  = n 3 n 2 (1-cosθ)+n 1 sinθ となり、回転行列 A は   |r 11  r 12  r 13  0| A=|r 21  r 22  r 23  0|   |r 31  r 32  r 33  0|   |0     0     0