🌐

three.jsやpixi.js等のライブラリを一切使わずにwebGL実行環境をJavaScriptスクラッチする(したい)

2022/11/13に公開約800字

青い長方形が表示されているだけですが、テクスチャ画像に表示を切り替えたり頂点の数を変えたり(四角を三角にしたり)する場所にコメントを入れてコネコネできるようにしています(リサイズ対応済み...のはず)

埋め込みcodepenの下に連ねている引用元の素晴らしい入門サイトから、バラバラとコードを繋ぎ合わせているため、コードの整合性や効率に言及できていません。「動いた〜〜やった〜〜」程度の実験場です。「ちょっとこのfragmentShaderの挙動試したいな〜」という時にすぐ動かせる場所がほしくて書いています。

webGL入門サイト

webglfundamentals

https://webglfundamentals.org/webgl/lessons/ja/

wgld.org

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

ICSメディア

https://ics.media/web3d-maniacs/webgl_media/

オススメwebGL学習教材(動画)

codemafiaさん

https://www.youtube.com/watch?v=GR1SUNnbKWo&ab_channel=マフィア先生のエンジニア塾

shin-codeさん

https://www.udemy.com/course/threejs-beginner/
https://www.udemy.com/course/threejs-shader-glsl/

Discussion

ログインするとコメントできます