物理演算ライブラリの Oimo.js 作者が贈る最高の実験室！ あまりのカッコよさに思わず絶句しました - WebGL 総本山
史上最高の WebGL Labs！ 今回ご紹介するのは、javascript の物理演算ライブラリとして非常に有名な Oimo.js の作者さんが作った、Example 集のサイトです。 ページのタイトルはシンプルに「 Labs 」とだけ記されています。しかしその内容は圧巻の充実度。インターフェースや配色、画面遷移の方法など、ウェブコンテンツとしていろいろな意味でかなり完成されています。 ベースは three.js 実装 独自のコードもかなり書かれていますが、3D 表現のベースになっているのは three.js です。実際に three.js で実装を行う場合には非常に参考になるのではないでしょうか。 トップページは中央に作者さんのよく利用されているアイコンが置かれています。その周囲にはサークル上に Examples が展開される仕組みですね。枝のように伸びるそれぞれの小さなサークルが、す
Moon by Ai Weiwei & Olafur Eliasson
Turn nothing into something – make a drawing, make a mark.
three.jsで遊んでみる（９） « Everyday Pieces ::
前回からだいぶ日が経ってしまいましたが、 ミクさんに物理演算を適用すべくチマチマやっておりました。 ただ残念ながら期待したようにはなってくれてません。 よく分からなかったり、うまく行ってくれなかったり、 自分の力不足な所が大きいと思うのですが、 JavaScriptでは荷が重いのかもしれません。 しばらく動作させるとハングアップしたりします・・・(^_^;) これ以上はうまく行きそうにない感じなので、 中途半端ではありますが、この辺りで〆にしようと思います。 それでも、それなりに得たものがないこともないので、 それをまとめておこうと思います。 前回でも触れましたが、 three.jsで物理演算をやるには、 BulletのJavaScript版であるammo.jsを使いますが、 three.jsからは直接ammo.jsを使いません。 physi.jsを仲介してその機能
Examples created by Yomotsu using THREE.js
Examples created by Yomotsu using THREE.js basic cube basic cube with textures load collada model load converted MMD models ray_basic ray_basic2 collitsion_detection_with_Ray MD2 model with actions kind of a TPS game triangle which is created from Vertex geom_from_vertex geom_from_vertex2 geom_from_vertex3 geom_from_vertex4 geom_from_vertex5 geom_from_vertex6 geom_from_vertex7 texture_using_2Dcanv
Three.js による頂点データの取り込みと描画 （イトカワの形状データ）
特定非営利活動法人natural science は、知的好奇心がもたらす心豊かな社会の創造にむけて、 現代社会では実感する機会の少ない科学や技術のプロセスを可視化・共有化する場づくりを通じて、 科学を切り口とした地域づくりを目指す、若手主体の団体です。 | More ≫ Three.js とは、HTML5で新しく登場する canvas 要素に Javascript を利用して描画する際に、便利なライブラリとして知られています。 これまで本サイトでは、canvas 要素に描画するデータを GPU 上から直接利用する WebGL と呼ばれるAPIのライブラリとして、Three.jsを利用しています。 本稿では、JAXAが公開している小惑星イトカワの形状データを利用して、ウェブ上でイトカワの３次元的に描画すること行います。 ある程度リアルな形状を実現しようとすると頂点データが膨大となり、マウス
Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot
Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot Seperti yang kita pahami waktu ini ada sangat banyak permainan slot online paling sederhana yang dapat dimainkan dalam sekejap hanya cukup masuk di sana saja ojekslot terunggul. Di sini dapat ada sangat banyak bermacam permainan luar biasa yang pastinya dapat anda temukan dengan ringan. Beraneka permainan terbaik di sini dapat and
Issue while using dat.GUI in a three.js example
I tried to use dat.GUI in the following three.js example. I just did the following code changes to add a GUI to adjust mesh opacity. var loader=new THREE.VTKLoader(); loader.load ("models/vtk/bunny.vtk", function(geom){ var mesh = new THREE.Mesh(geom, material ); mesh.doubleSided=true; mesh.position.setY(-0.09); scene.add( mesh ); var gui = new dat.GUI(); var view = this; view.Opacity = 0.2; var m
Using SketchUp Models
Sketchup → Collada Click on the menu item File > Export > 3D Model.... Choose COLLADA File (.dae) as export type. If you want to export the textures, click on Options and make sure that Export Texture Maps is checked. Click on Export. SketchUp will create a Collada file named your-model.dae and a folder named your-model that contains the model's textures. Collada → Three.js Make sure you download
多彩な表現力の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はこれまで解説し
ポリゴンとテクスチャ - ずっと君のターン
THREE.jsにはデフォルトのジオメトリが豊富で、いろいろなモデラーからのインポートも容易なようですが、プログラマ的にはポチポチと座標を指定した図形も表示してみたい。ということでやってみます。 HTML 前回と一緒。 <!doctype html> <html lang="en"> <head> <title>Polygon and Texture</title> <meta charset="utf-8"> <style>body { background-color:black; padding:0; margin:0; }</style> <script src="js/Three.js"></script> <script src="js/RequestAnimationFrame.js"></script> <script src="js/jquery-1.7.1.min.js
atpages.jp - このウェブサイトは販売用です！ - atpages リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
three.jsとdat.guiで遊ぶ - bate's blog
テスト的なものを作ってみた。 カメラは制約付きで球上を動きます。 http://dl.dropbox.com/u/67579260/sample.html コードはサンプルの改造程度のもの。 <!doctype html> <html lang="en"> <head> <title>three.js, dat.GUI</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"> <style> body { font-family: Monospace; background-color: #f0f0f0; margin: 10px; overflow: hidden; }
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
MortonOrder+八分木による衝突判定ライブラリ | Blog in a well
ご無沙汰しております、F22愛好会です。前回の更新から2ヶ月近く経ってしまいましたが、なんとか生きています。 最近ちょこっとThree.jsというライブラリを使ったWebGLに手を出しています。どんなものを作っているかというと、特にゲームなどの形にはなっていないのですが、こんな感じです。 サンプル1:指定空間内を球体がランダムに移動して跳ね返ったりする(座標[0,0,0]から[99,99,99]までの空間内の球体はマテリアルが黒色に変化) サンプル2:指定空間内を球体が重力の影響を受けながら移動して跳ね返ったりする。(Spaceキーで球体追加、Enterキーで球体をランダム加速) 見ての通り、まだThree.jsの基本を確認しているといった段階です。 ところで、この手の大量のオブジェクトの当たり判定を行う時、総当たりで距離を確認するともの凄い処理量が要求されるようになってしまいます。100
未来派図画工作
Three.jsはじめの一歩2012.04.13 Three.jsを始めてみたい方のために、シンプルなスクリプトをご紹介します。カメラとライトが一つずつ。一枚の板ポリゴンに、アルファチャンネル付きのPNGファイルをマッピングしたものです。 サンプルファイルをダウンロードして、index.htmlをChromeなどのWebGLが見れるブラウザで開いてみてください。黒い背景の中央にアンモナイト一匹が表示され、マウスドラッグで視点を動かす事が出来ます。 ご覧の通り、必要最小限のシンプルなシーンなので、Three.jsで3Dがどのように扱われているかを把握しやすいのではないかと思います。ソースのコメント部分に簡単な解説を入れてありますので参考にしてみてください。私もまだまだThree.jsの全貌は把握しきれていませんが、とてもシンプルで使いやすく、WebGLの可能性を感じるには素晴らしいライブ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Using STL format in Three.js · Issue #455 · mrdoob/three.js
Blogger
ShadowMap doesn't work with PlaneGeometry, but works with CubeGeometry? · Issue #1637 · mrdoob/three.js
three.js css3d - periodic table