JavaScript 3DレンダリングエンジンのThree.jsを試す
こんにちは。 KRAYアルバイトの浅海です。 今回は、最近ちまたで噂のThree.jsで遊んでみようとおもいます。 http://github.com/mrdoob/three.js webgl対応のブラウザで見ている方は、右上に3Dのボックスが表示されていると思います。 Three.jsを使えば、このようなことを簡単にJavascriptで実現できるのです。 半信半疑で使ってみたところ、たしかにThree.jsでは、3D特有の行列計算や数学的思考をせずとも、3Dを表示、操作することができました。 「ちょっとのプログラムで3Dができる。」 この面白さを皆さんに届けたいです。 目次 立方体を表示する 光をあてる テスクチャを貼り付ける マウスで回転させる マウスで移動させる クリック判定する Three.js web上には、HTML5のcanvasを利用した様々なサンプルページやアプリケーシ
gl.enchant.js 入門 – ざっくりと作る流れをまとめてみました!! | TM Life
ついに enchant.js の拡張プラグイン gl.enchant.js の β版が公開されました. これは内部的に WebGL を使っているので高速で豊かな 3D 表現が可能です. OpenGL や 3D プログラミングは仕事柄, 専門というか得意分野なので, ついにキターって感じです♪ さっそく使ってみて, ついでに簡単なプログラムを作る流れをまとめてみました. 以前書いてたくさんの方に見ていただいた『enchant.js を使ってゲームを作ろう!!』同様, step 形式で細かく区切っています. 参考になれば幸いです. Sample and Download 今回制作するサンプルはこちら. 球体を表示して, キーボードやマウスで回転できるようにしただけの単純なサンプルです. ジンバルロック対応は気が向いたらやります. また, クロスドメインの規制でローカルではテクスチャが使えないの
CanvasタグとJavaScriptで3Dのデモを作ってみました | ClockMaker Blog
HTML5というわけではないですが、CavasタグとJavaScriptを使って3Dのデモを作ってみました。 デモを見る ソースコード (［右クリック］→［ソースを見る］を選択) こういうのを見れば「HTML5すごい、Flashいらない」と思う人もいるかもですが、冷静にファーストインプレッションを。同じものを以前Flashで実装したことがありますが（Papervision3D演出サンプルNo.01:羽ばたく蝶々）、両者のデモを比較することでメリット・デメリットが見えてきます。 ＜追記：2013年9月3日＞ Three.jsの最新版rev 60にアップデートしてみました。3年前に作成したときはrev 17だったのですが、別物のライブラリと言わんばかりにほとんどAPIが変わってしまっています。ちなみにTypeScriptで書きなおしています。 デモを見る ソースコード (TypeScript)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
reveal.js - The HTML Presentation Framework
