Three.jsがNext.js環境で動くか、試したところ、動きました！Three.jsのドキュメントのGet Startedがベースですが、個人的にやってみたかったこともいくつか追加。任意のタグの中にcanvasタグを配置、画面リサイズに対応してcanvasタグもリサイズ、ライティ…

Three.jsの続きです。ics.mediaの「Three.js入門」前回までは入門編、今回から「基礎編」に入ります！まずはマテリアル。質感の設定です。入門編の頃にも少し触れましたが、今回はいろいろな種類のマテリアルを貼ってみます。それでは行きましょう！

Three.jsの続きです。前回は三角関数を使ってカメラの動きを制御しました。今回はさらにカメラの位置をインタラクティブに操作できるようにします。Three.jsの拡張ライブラリ「OrbitControls.js」を使います。それでは行きましょう！

Three.jsの続きです。前回はジオメトリ設定で色々な形を作りました。今回はカメラの制御です。コードの理解のためには三角関数の理解が必要でした。サイン、コサイン、タンジェントとか聞き覚えはあったけど、それを使う目的はわかっていなかったです。それ…

Three.jsの続きです。前回はマテリアルとライティングをやってみました。今回はジオメトリに入ります。Three.jsに用意されている様々な形状のジオメトリ設定を試してみました。それでは行きましょう！

Three.jsの続きです。前回はThree.js入門のの回る箱をいろいろ打ち替えてみました。今回は「マテリアル」と「ライティング」を見てきます。それでは行きましょう！

ブラウザで3Dコンテンツを作るJSライブラリ「Three.js」。前回は回る箱を表示してコードを細かく見ました。今回は実際の動きとしてどこをどう打ち替えたらどう変わるのかを実体験していきたく思います。それでは、どうぞ！

以前ご紹介した「WebGL」の続きになります。今年こそブラウザ3D事始めんと欲し「書き初め」的に書いた投稿からもうじき半年…。 前回tone.jsと同様、今回も便利なライブラリ「Three.js」を使って一刻も早く体験したく。いざっ！