物理演算ライブラリの Oimo.js 作者が贈る最高の実験室！ あまりのカッコよさに思わず絶句しました - WebGL 総本山
史上最高の WebGL Labs！ 今回ご紹介するのは、javascript の物理演算ライブラリとして非常に有名な Oimo.js の作者さんが作った、Example 集のサイトです。 ページのタイトルはシンプルに「 Labs 」とだけ記されています。しかしその内容は圧巻の充実度。インターフェースや配色、画面遷移の方法など、ウェブコンテンツとしていろいろな意味でかなり完成されています。 ベースは three.js 実装 独自のコードもかなり書かれていますが、3D 表現のベースになっているのは three.js です。実際に three.js で実装を行う場合には非常に参考になるのではないでしょうか。 トップページは中央に作者さんのよく利用されているアイコンが置かれています。その周囲にはサークル上に Examples が展開される仕組みですね。枝のように伸びるそれぞれの小さなサークルが、す
多彩な表現力のWebGLを扱いやすくする「Three.js」
多彩な表現力のWebGLを扱いやすくする「Three.js」：Webグラフィックをハックする（5）（1/5 ページ） Three.jsはWebGLの冗長な仕様をうまくラップし、扱いやすいインターフェイスで提供するライブラリだ。サンプルコードと見比べながら、効率良く学習しよう Three.jsの基礎 本連載も5回目を迎え、いよいよ佳境に入ります。今回の題材は、Webブラウザ上で3次元グラフィックを実現する「WebGL」です。ただし、これまでと違ってAPIを直接は触れず、「Three.js」を利用します。Three.jsはWebGLの冗長な仕様をうまくラップし、扱いやすいインターフェイスで提供するライブラリです。Mr.Doob氏を中心にオープンソースで開発が進められており、WebGL界隈ではデファクトスタンダードに近い地位を築いています。 Three.jp公式サイト WebGLはこれまで解説し
Aerotwist - Home
Web Development Most of them will probably be about front-end performance work, or possibly broader coding things. The odd one will be tagged #personal or #opinion, so if you have the RSS feed you can filter those out if you don't want them! 18/Jun 2022 Dear Zach #update, #longtimenospeak 10/Dec 2016 🌟 When everything's important, nothing is! 🌟 #performance, #loading 30/Aug 2016 Slicing SVG 9 Wa
WebGL and Three.js
Colin Barre-Brisebois - GDC 2011 - Approximating Translucency for a Fast, Che...Colin Barré-Brisebois
Three.js でオリジナルシェーダを書く | ソフト職人
Three.js には豊富なシェーダも付属していますが、オリジナルのシェーダを書くことも出来ます。開発段階では付属のシェーダを使うのがお手軽ですが、見た目を追及するにはシェーダに手を入れる必要も出てきます。ということで、 Three.js でのオリジナルシェーダの書き方を調べてみました。 今回は次のサイトを参考にしました。 SHAGERS-part2- ShaderMaterial THREE.ShaderMaterial を使うとオリジナルシェーダを書くことが出来ます。上記のサイトでは THREE.MeshShaderMaterial を使っていますが、現状は内部的に同じものになっています。 26 行目からの initShaderMaterial() 内で ShaderMaterial を作成し、あとで作る Mesh に適用しています。 ShaderMaterial を作成しているところ
The 20th Century Voyage | ScreenSaver fot macOS | 未来派図画工作のすすめ
The twentieth century was an era of invention. A number of technological innovations have greatly changed society. But on the other hand, the 20th century was also a century of war. The whole world hated and many important things were destroyed. This work was made to know the times of such turbulence. About 5,000 histories are displayed quietly and randomly. This is a space-time journey. It will p
Three.js doc
top THREE.PerspectiveCamera File doc/three.js/src/cameras/PerspectiveCamera.js Instance Variables fov aspect near far fullWidth fullHeight x y width height projectionMatrix Superclass THREE.Camera Examples (122) doc/three.js/examples/canvas_geometry_birds.html (source) doc/three.js/examples/canvas_geometry_cube.html (source) doc/three.js/examples/canvas_geometry_earth.html (source) doc/three.js/ex
【１】Cubeで遊ぼう！ 迷路生成編 - はじめてのthree.js
はじめに three.jsはレンダラを変えるだけで、Canvas(2D)にもWebGLにも書き出せるっていう、色々と技術遷移中の今の時代にピッタリなJavascript 3D Engineです。 node.jsも楽しいけど、表現系でも遊んでみたい！って時に手軽にさわれる逸品です。(3Dよくわかりませんが・・・) とりあえずは準備 まず、GitHubからソース落としてきます。gitで落としてもいいし、zipファイル(右の方にダウンロードボタンがあるよ)でも落とせます。 展開すると色々入ってますが、基本必要なのは "build/Three.js" です。サンプルでは他のも利用しますが、随時配置してください。 あー、それとthree.jsのデモを見た人は、3Dモデリングソフトで作ったモデルを読み込んでグリグリ・・・みたいなのを期待してるかもしれませんが、今回そーいうの無いですよ、自分、3Dソフト
HTML5による物理シミュレーション環境の構築 ～WebGLライブラリThree.js 入門（１／３）～
HTML5とWebGL 初めにHTML5の位置づけについて簡単に触れます。HTML5とはこれまでのWebページ作成言語で主流だったHTML4やXHTMLの後継言語のことで、 2008年に草案がまとめられ、2014年までにウェブブラウザ各社への正式勧告を目指して策定が進められています。 HTML5は 2012年1月でもまだ「草案」段階で、仕様も流動的な準備段階であるが、開発側からもユーザ側からも非常に注目が集められています。 その大きな理由の一つに挙げられているのが、iPhoneやAndroidなどのスマートフォンの台頭による情報端末の多様化への対応のためです。つまり、様々なWEBコンテンツのクロスプラットフォーム化への重要な貢献が期待されているからです。 というのもスマートフォンの登場までは、Adobe社が提供する FLASH が動画やオーディオなどが組み合わされたマルチメディアコンテンツ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
blog.alumican.net » Blog Archive » そろそろWebGLを・・・