超簡単に3DCGできるJavaScriptライブラリ作った - aike’s blog
ブラウザでWebGLが使えるようになって3DCGプログラミングはずいぶん身近なものになりました。と書いてるそばから違和感を感じるくらい生のWebGLをJavaScriptで書くのは敷居が高かったりします。できなくはないけど前提となる知識がかなり必要な感じ。 three.jsが登場したときは、これで普通に3DCGができるということで一気にひろまりました。とはいえ、それでもまだやることは多く、画面に四角い箱を表示する場合以下のようなプログラムを書くことになります。 ・シーンを作成 ・ライトを作成、位置と向きを設定、シーンに追加 ・カメラを作成、位置と向きを設定、シーンに追加 ・マテリアルを作成、色を指定 ・BoxGeometryを作成、サイズを指定 ・メッシュを作成、位置と向きを設定、シーンに追加 ・レンダラーを作成 ・レンダリングループ処理 これらのひとつでも間違えたりパラメーターが適切でな
Three.js : WebGL限定の Cube テクスチャによる『パノラマ背景』
VBScript(49) コマンドプロンプト(17) Iray DAZ3D DAZStudio イラスト(12) イラストAC ダウンロードリスト(14) DAZ3D(48) DAZ3D プロダクト(8) DAZStudio(19) イラストAC(22) DAZ3D DAZStudio イラスト 2016(16) 壁紙:イラストAC(8) 背景:イラストAC(14) 人物:イラストAC(4) ﾌｧﾝﾀｼﾞｰ:イラストAC(3) その他:イラストAC(8) ブックマークレット(4) 生活 : お金(14) 生活 : トラブル・知恵(6) 生活(6) Android(32) API(7) C#(22) C++(27) CSS(8) DAZ3D DAZStudio イラスト 2015(17) DAZ3D DAZStudio イラスト 2014(11) DAZ3D DAZStudio イラスト 2
IE でも WebGL が動く方法 : Three.js と IEWebGL で ページを書く手順。
(1) : ヘッダ( head要素内 ) IE では、開発者ツールが開いていないと、console.log がエラーになるので先に実装しておいて、IEWebGL を使う為の基本ツール(webglhelper.js)を『必要な時だけ読みだす』ようにしています。 (2) : Three.js を展開する部分への実装 通常ならば、container_three 内に展開されるのですが、IEWebGL の場合オブジェクトなので、代替えとして埋め込む為に、container_three 内 にスクリプトを書いています。ここでは、renderCanvas と言う名前で代替えエリアを作成して後でその部分を使うように記述します。また、ie 以外でも WebGL が使えないブラウザの為に、描画エリアとしてのこの場所にメッセージを表示するようにしています。 (3) : いろいろチェック ちょっと不自然なコード
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
