Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developer.mozilla.org/ja/docs/Web/API/WebGL_API/Tutorial below:

WebGL チュートリアル - Web API

このチュートリアルでは、 <canvas> 要素を使用して WebGL グラフィックを描画する方法について、基本から説明します。提供されている例から、 WebGL でできることの明確な概念を知ることができ、独自のコンテンツを作成する際に役立つコードスニペットを提供します。

WebGL により、プラグインを使用することなく HTML の <canvas> 内で 3D グラフィックをレンダリングするための OpenGL ES 2.0 に基づく API をウェブコンテンツから使用できます。 WebGL のプログラムは JavaScript で記述する制御コードと、コンピューターの Graphics Processing Unit (GPU) で実行する特殊効果コード（シェーダーコード）で構成されます。 WebGL 要素は他の HTML 要素と混ぜられ、他のページ部品やページの背景と合成されます。

<canvas> 要素を使用することはそれほど難しくありませんが、 HTML や JavaScript の基礎を理解している必要があります。 <canvas> 要素や WebGL は一部の古いブラウザーが対応していませんが、すべての主要なブラウザーの最近のバージョンが対応しています。キャンバスにグラフィックスを描画するためには、 JavaScript のコンテキストオブジェクトを使用します。このオブジェクトは、グラフィックスをその場で生成します。

WebGL 入門

WebGL コンテキストのセットアップ方法です。

WebGL コンテキストへの平面コンテンツの追加

WebGL を使用して単純な平面図形を描画する方法です。

シェーダーを用いた WebGL での色の指定

シェーダーを用いた図形への色の設定方法について紹介します。

WebGL でのオブジェクトのアニメーション

簡単なアニメーションを作成するための、オブジェクトの回転と変換の方法を紹介します。

WebGL を用いた 3D オブジェクトの作成

3D オブジェクト（今回は立方体）の作成とアニメーションの方法を紹介します。

WebGL でのテクスチャの使用

オブジェクトの表面にテクスチャをマッピングする方法について紹介します。

WebGL でのライティング

WebGL コンテキストにおいて光の稿かをシミュレーションする方法です。

WebGL でのテクスチャのアニメーション

テクスチャをアニメーションさせる方法についてです。ここでは、回転する立方体の表面に Ogg ビデオをマッピングする手法を紹介します。

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4