WebGL - これがGPUの力！Three.jsによる“リアルタイム”なレイトレーシング - Qiita
これはWebGL Advent Calendar 15日目の記事です。 【2016/01/29 追記】続編である「これがGPUの力！three.jsによる“リアルタイム”なレイトレーシング 〜宝石編〜」を公開しました。 はじめに Three.jsからGPUをつかって、リアルタイムなレイトレーシングを実装できたので紹介します。 iPhone6などの携帯端末でも動作するくらい軽量です。次のリンクから動作の様子をご覧になってください！ Reflect カラフルな球体に周囲の球体や床を鏡面反射させました。 マウス移動によって、上からの視点にもできます。 無数の球体がずら〜っと並ぶ様子は、ちょっと壮観ですね！？ 一般的にレイトレーシングを行うためには、膨大な計算が必要です。 ソフトウェアで実装した場合、数個の球体を配置しただけでもリアルタイムに処理するのは困難です。 2010年の記事によると、For
たった3KBのコードで3DCGモデルが歌って踊ってアングルも操作できる！ jQueryベースのライブラリでMMDデータを活用したWebGLコンテンツを作ろう
はじめに 数あるHTML5の機能の中でも、特にビジュアルでインパクトのあるWebGL。GPUを駆使した高速3DCGレンダリングが可能なことで話題になったものの、今一つ普及しない背景には「実装があまりにも難しい」ことがあるのではないでしょうか。 three.jsの登場により、実装のハードルはだいぶ下がりました。しかし、JavaScriptに精通したプログラマでなければ使いこなすのは容易ではなく、ビジュアル要素の強いWebGLにあってデザイナーさんの参入は難しいのが現状です。 今回紹介する「jThree（ジェイスリー）」は、そんなWebGLをjQueryの記法で扱えるようにするための国産JavaScriptライブラリです。前述のthree.jsをラップしてjQueryで操作できるよう設計されており、jQueryを使ったことのある方なら、手軽にWebGLコンテンツを作ることができます。 本記事で
WebGLに対応し高速化したCreateJSの描画性能を探る - ICS MEDIA
インタラクティブコンテンツ制作に役立つHTML5向けのフレームワークCreateJS (使い方は入門サイトを参照ください)。2014年1月に公式ブログでWebGLサポートが発表されました（参照記事「WebGL Support in EaselJS」)。公式ブログによるとパフォーマンスが従来比の6〜50倍にも達するとのことです。 果たしてどのぐらいの性能があるのか気になりましたので、以前の検証記事「HTML5開発者必見、最速のJavaScriptライブラリはどれだ!? パフォーマンスの徹底検証」を元に、WebGL対応版のCreateJS(描画を扱うJSライブラリ「EaselJS」)のパフォーマンスを比較検証してみました。検証に用いたデモは次のリンクをクリックすることで再生できます。 CreateJS (EaselJS 0.7.1) : 従来版。CanvasのContext2Dが利用されている
ブラウザーの3D表現もここまで来た！WebGLを使った驚きのWebサイト
ブラウザーで3次元コンピュータグラフィックスを表... / WebGLを使った3D表現 / SculptGL他...全13件 ブラウザーで3次元コンピュータグラフィックスを表示させるための標準仕様「WebGL」。Microsoftも重い腰を上げ、次期バーションの「IE11」からWebGLを標準サポートすることが決定しています。これからますます目にする機会が増えそうです。 そんな、圧倒的な3D表現が可能なWebGLを使った驚きのWebサイトを集めました。
WebGL and Three.js
Colin Barre-Brisebois - GDC 2011 - Approximating Translucency for a Fast, Che...Colin Barré-Brisebois
WebGL対応ブラウザ向けの3Dモデルビューア提供サービス「Sketchfab」 - 強火で進め
「Sketchfab」はBlenderから3Dモデルをサーバにアップロードして、WebGLで動作する専用のプレーヤーで表示する事が可能なサービスです。 Sketchfab blog - publish interactive 3D online http://blog.sketchfab.com/ 埋め込みタグについてはこちらに書かれています。こちらのページで実際の動作が試せます。 Sketchfab embed - Sketchfab blog http://blog.sketchfab.com/sketchfab-embed#more WebGL対応のブラウザでアクセスしてみて下さい。ちょっとロード時間はかかりますが操作自体はとても快適なプレイヤーでした。 Blenderからのアップロードをしている動画。 アップロードするにはAPI Keyが要るみたいです。詳細はこちらに記載されていま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Blogger
WebGL 環境上でメタセコイアで作った 3D モデルを見られる, メタセコイアビューアを作ってみた | TM Life
