タグ

three.jsに関するtarchanのブックマーク (5)

  • 超簡単に3DCGできるJavaScriptライブラリ作った - aike’s blog

    ブラウザでWebGLが使えるようになって3DCGプログラミングはずいぶん身近なものになりました。と書いてるそばから違和感を感じるくらい生のWebGLをJavaScriptで書くのは敷居が高かったりします。できなくはないけど前提となる知識がかなり必要な感じ。 three.jsが登場したときは、これで普通に3DCGができるということで一気にひろまりました。とはいえ、それでもまだやることは多く、画面に四角い箱を表示する場合以下のようなプログラムを書くことになります。 ・シーンを作成 ・ライトを作成、位置と向きを設定、シーンに追加 ・カメラを作成、位置と向きを設定、シーンに追加 ・マテリアルを作成、色を指定 ・BoxGeometryを作成、サイズを指定 ・メッシュを作成、位置と向きを設定、シーンに追加 ・レンダラーを作成 ・レンダリングループ処理 これらのひとつでも間違えたりパラメーターが適切でな

    超簡単に3DCGできるJavaScriptライブラリ作った - aike’s blog
  • 全天球パノラマ動画を表示するJavaScriptライブラリ作った - aike’s blog

    複数台のGoProを組み合わせて360度上も下も撮影できる動画カメラが一部で流行りつつあるようです。 こんなやつ。 http://home360.co.jp/freedom360.html http://freedom360.us/ 要はRICOH THETAの動画版なんですが、動画ということで機材の価格もだいぶ違うし、複数の動画を合成する作業もまだまだけっこう手間も時間もかかります。 そこまで頑張って動画を作っても、公開がまた大変です。フリーのスタンドアロンプレイヤーはありますが(これとか)、見る人にインストールさせるのはちょっと面倒だし、Flashで作られた全天球動画プレイヤーも良いものがいろいろあるものの、自由にダウンロードできて自分のサイトで手軽に使えるものは今はちょっとなさそうです。 そんなわけでJavaScriptのThree.jsを使ってさくっと全天球動画プレイヤーを作ってみ

    全天球パノラマ動画を表示するJavaScriptライブラリ作った - aike’s blog
  • Aaronetrope

  • 第10回 #gtuggirls でWebGLとThree.js のコードラボをしました

    さてさて、記念すべき第10回の GTUG Girls は WebGL ・ Three.js のコードラボを行いました! 例によって例のごとく、まずはなごみタイムから。ご飯をべつつみんなで仲良くなります。     今回は10回記念ということで、アマンドの...

    第10回 #gtuggirls でWebGLとThree.js のコードラボをしました
  • Three.js対応。Webブラウザ上で3Dモデルを作成·ThreeFab MOONGIFT

    ThreeFabはTree.jsに対応した3DモデルをWebブラウザ上で作成できるソフトウェアです。 Three.jsはJavaScriptで高度な3Dモデルを描画するエンジンですが、そのモデル作成はやはり大変な作業になります。そこで使ってみたいのがThreeFabになります。 最初の画面です。3Dモデルが奇麗に描かれていて格好いいです。 マウスで視点の変更もできます。 モデルを追加できます。 回転したりライトを変更することもできます。 最終的に作成されるコードを使ってThree.jsで3Dモデルを描けます。 こんな感じにモデルを追加していきます。 ThreeFabを使えばThree.jsで使えるモデルをWebブラウザ上で作成できます。S、D、X、スペースキーがそれぞれショートカットキーとして使えます。最初、慣れるまではなかなか操作が難しいかも知れません。ThreeFabはさらにアニメーシ

    Three.js対応。Webブラウザ上で3Dモデルを作成·ThreeFab MOONGIFT
  • 1