Not your computer? Use a private browsing window to sign in. Learn more about using Guest mode
Not your computer? Use a private browsing window to sign in. Learn more about using Guest mode
<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAABkCAYAAADDhn8LAAAgAElEQVR4Xry9B5idV3Wvv496l6b3mTMzmlGZkWY00siS1UbVtiRbrpJs2bIs29iWjbFDMUbGFsWATTMlgKimmZjQEgLEJAFDKAmEUBISckkxCfcmhJQbSG/n/757n2/OOVOkGfJ/7n6erTOjOd/+vm+XtX7rt9ZeOxdCKFBHSy4XQueyENqXhtC6JISWJdWhbUldyC9rCD3VzaG3oTWEjs4QBrtCWPNPXHd18JqsnBgM4fjA3rCz74IQ1vaFsLExhKq/4c+PUb9MvYX6zuI1z+fnNdTjobsqhD/5+1fz82rq26m/VP5Y5/158dwQzox0
Examples Physics plugin for three.js Physijs brings a very easy to use interface to the three.js framework. One of the reasons three.js is so popular is because it is so incredibly easy for graphics newbies to get into 3D programming. Physijs takes that philosophy to heart and makes physics simulations just as easy to run. In fact, there are just five easy steps that must be taken to make a 3D sce
I’ve been creating a series of lessons as a way of teaching myself WebGL. The first ten are based on the well-known NeHe OpenGL tutorials, but I’ve diverged since then. Here are the ones so far. If English isn’t your first language, you might like these translations of the lessons: Chinese: 本课程中文版 Spanish: español Japanese: 日本語でのレッスン Lesson 0: Getting Started shows you how to download, install and
次のページ WebGL により、ウェブコンテンツで OpenGL ES 2.0 ベースの API を用いて、対応しているブラウザーではプラグインを使わずに、 2D および 3D の描画を HTML の canvas において行うことができます。 WebGL のプログラムは JavaScript で記述する制御コードと、コンピューターの Graphics Processing Unit (GPU) で実行するシェーダーコード (GLSL) で構成されます。 WebGL 要素は他の HTML 要素と混ぜられ、他のページ部品やページの背景と合成されます。 この記事では、 WebGL の基礎を紹介します。ここでは、 3D グラフィックに関して数学的に理解していることを前提とし、 3D グラフィックの概念自体の説明は行いません。 このチュートリアルで使用するコード例は、GitHub の webgl-
Firefox 4以降からは、WebGL対応のグラフィックカードを搭載しているPCで3Dグラフィックスを描画することができるようになっています。 この機能を利用して、どんなウェブページも3D化することができるようになるというアドオンが話題になっていましたので、ちょっと試してみました。 WebGLを利用して、表示しているウェブページを3D化する「Tilt」は、複数のMozilla開発者による「Developer Tools project」から生まれた実験的なアドオンです。 WebGL対応PCでFirefox 4以降を利用している環境にこのアドオンをインストールすると、任意のページを3D化し、マウスでグリグリと動かすことができるようになります。 使い方は非常に簡単です。 3D化したいページを開き、Ctrl+Shift+L（Macの場合Cmd+Shift+L）を実行するか、ツールメニューから[
I’ve been creating a series of lessons as a way of teaching myself WebGL. The first ten are based on the well-known NeHe OpenGL tutorials, but I’ve diverged since then. Here are the ones so far. If English isn’t your first language, you might like these translations of the lessons: Chinese: 本课程中文版 Spanish: español Japanese: 日本語でのレッスン Lesson 0: Getting Started shows you how to download, install and
みたいなことを先週、ぴろたんと話していてですね。実際どうなるのか試してみました。こうなります。 赤い点線の枠が WebGL を有効にした canvas で、中の青い三角形は WebGL で描画されています。後ろの写真と「GL Overlay Test」という文字は通常の HTML です。 一見ちゃんと描画されているように見えますが、左側の半透明の三角形が、加算合成したような描画結果になっており、少し変です。本来であればもう少し暗い色で描画されている筈です。これは Chrome/Firefox あるいは Mac/Windows を問わず同じなので、今のところWebGL の描画結果を半透明で合成すると確実におかしくなるので、やめたほうがいいと言えます。が、逆に言えば、完全に不透明か完全に透明な部分は正しく合成されるので、限定的には使えるとも言えます。（描画結果にアンチエイリアスがかかっている場
追記：例題の頂点シェーダーで何をしているか説明を追加しました 追記：動作環境の所修正しました、IE9では動作しません。 皆さんはじめまして、荒川智則です。この記事はJavaScript Advent Calendarの21日目です。 この記事では、Google I/OやFirefox Developers Conferenceで華麗なデモがバリバリ出てくるにもかかわらず、実際に使っている人が異常なまでに少ないWebGLについて書きます。対象読者はWebGLに興味があるor手を出してみたけどクソ難しそうだし既に諦めそう、という人です。 WebGLの概要 WebGLはOpenGL ES 2.0のグラフィックAPIをCanvas要素上で使える様にした物です。OpenGL ESはOpenGLの組み込み機器向けのサブセットで、iPhoneやandroid端末にも搭載されています。OpenGL ESな
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
