[B! GLSL][JavaScript] cx20のブックマーク

cx20 id:cx20

GLSLとJavaScriptに関するcx20のブックマーク (4)

[js1k] GL Dragon Flight（解析結果） - jsdo.it - Share JavaScript, HTML5 and CSS
[js1k] GL Dragon Flight（解析結果）この作品のポイントは、以下の圧縮用コードにあるかと思います。＜圧縮用コード＞ for(i in g) { g[i[1]+i[7]+i[i.length-1]]=g[i]; } この処理は長い WebGL の API を3文字化することで効率的なコード圧縮を実現しているようです。圧縮前： bindBuffer(ARRAY_BUFFER, createBuffer()); 圧縮後： ifr(RUR, rur()); ＜対応表＞ RUR : ARRAY_BUFFER = [34962] ESR : VERTEX_SHADER = [35633] RES : TRIANGLES = [4] rur : createBuffer = [function createBuffer() { [native code] }] rrm : cr
cx20 2015/01/12
GLSL のコードを抜き出してみました → http://goo.gl/aMeZpT

WebGL

JavaScript

GLSL
リンク
WebGL Water
Made by Evan Wallace This demo requires a decent graphics card and up-to-date drivers. If you can't run the demo, you can still see it on YouTube. Interactions: Draw on the water to make ripples Drag the background to rotate the camera Press SPACEBAR to pause and unpause Drag the sphere to move it around Press the L key to set the light direction Press the G key to toggle gravity Features: Raytrac
cx20 2015/01/12
前に見かけたと思ったら、微妙に URL が違ってた。http://b.hatena.ne.jp/entry/madebyevan.com/webgl-water/ あと、ついでに試してみた。http://jsdo.it/cx20/qvqR

WebGL

JavaScript

GLSL
リンク
[WebGL寄稿] JS1k 作品で見つけた WebGL 超絶圧縮コードを紐解いてみる - WebGL 総本山
WebGL 総本山寄稿記事第二弾！今回は、jsdo.it などを中心に、尋常ではない量のサンプルやデモを多数公開されている @cx20 さんから寄稿いただきましたので掲載させていただきます。今回のテーマは javascript の圧縮。js1k と呼ばれる、1 キロバイト以下の容量でデモを作り完成度を競うイベントから、コード圧縮のテクニックについて抜粋して解説してくださっています。 WebGL の冗長なメソッド名が非常に短くなるというテクニックで、幅広く使える技術というわけではないかもしれませんが、コードを手入力で圧縮する方法としてすごく斬新なアイデアだなと思いました。以下、寄稿記事です。 JS1k で見つけた超絶コード JS1k（js1k.com）という大会をご存じでしょうか。この大会は、名前にあるように、1キロバイトの JavaScript でゲームやデモを競う大会になります。
cx20 2015/01/11
解説記事を書いてみました。

WebGL

JavaScript

GLSL
リンク
GLSL ray marching を試してみるテスト - CX's Hatena Blog
昨日、Tokyo WebGL Meetup でレイマーチングなるものを教えてもらったのでスライドの内容を試してみました。以下のサンプルは、全能感UP! GLSLで進めレイマーチング « demoscene.jp と GLSL ray marching -フラグメントシェーダでレイマーチング- のスライドを見ながら作成しました。その１「シェーダの基本となるコード」の実行結果スライド 61 / 120 の「シェーダの基本となるコード」その２「シェーダ内で ray (レイ)を定義」の実行結果スライド 64 / 120 の「シェーダ内で ray (レイ)を定義」その３「球体のサイズと distance function」の実行結果スライド 76 / 120 の「球体のサイズと distance function」その４「法線を求める関数を定義」の実行結果スライド 87
cx20 2014/06/14
レイマーチングを試してみました。 #webgl_tokyo

WebGL

GLSL

JavaScript
リンク
1

お知らせ

もっと読む

公式Twitter

@HatenaBookmark
リリース、障害情報などのサービスのお知らせ
@hatebu
最新の人気エントリーの配信

キーボードショートカット一覧

j次のブックマーク

k前のブックマーク

lあとで読む

eコメント一覧を開く

oページを開く

設定を変更しましたx