1.1コンピュータグラフィックスの簡単な歴史的レビュー
要約：初期のコンピューターは、スイッチとライトの列で構成されていました（ENIAC）。技術者やエンジニアは、これらのマシンをプログラムして計算結果を読み取るために、数時間、数日、さらには数週間働く必要があります。時間の経過とともに、これらすべてが徐々に変化してきました。データは、テープ、ディスク、さらには穴あき紙に1行ずつ、または穴あきカードの山（穴あき紙テープ）に効果的に保存できます。
1.1.1電子時代への参入
概要：
①。紙はコンピュータの出力メディアとして非常に有用であり、今日でも主要な出力メディアの1つです。しかし、従来のディスプレイメディアの場合、紙は高すぎるように見えるかもしれません。常に紙を出力媒体として使用すると、天然資源が無駄になります。特にほとんどの場合、計算結果やデータベースクエリの出力をハードコピーする必要はありません。
②。コンピュータの補助装置として、ブラウン管（CRT）は衝撃的な技術です。元のコンピューターモニター（ディスプレイ）として、最初にASCIIテキストを表示したのは単なるビデオ端末（CMDブラックウィンドウに似ています）でした。ただし、CRTは、アルファベット文字だけでなく、点や線も完全に描画できます。間もなく、他の記号やグラフィックがキャラクター端末に追加されました。プログラマーは、コンピューターとモニターを使用して、テキストまたは表形式の出力を補足するグラフィックを作成します。その後、描画の実行と曲線のためのいくつかのアルゴリズムが開発され、一般に公開されました。その結果、コンピュータグラフィックスは趣味から科学へと徐々に変化しました。
③。当初、これらの端末に表示されるコンピュータグラフィックスは2次元、略して2Dでした。人々は、さまざまな形を作成して組み合わせるために、平らな線、円、および多角形を使用し始めました。探検精神に満ちたプログラマーは、いくつかの簡単なアーケードゲーム（Lunar Lander、Pongなど）を作成しました。彼らが使用するシンプルなグラフィックは、さまざまな線種で描画され、1秒間に数回更新（再描画）されます。
1.1.23Dに向けて
3次元（または3D）という用語は、説明または表示されるオブジェクトが、幅、高さ、および深さの3つの次元を持つことを意味します。
たとえば、机の上の紙（いくつかの図が描かれている、またはいくつかの単語が書かれている）は、知覚できる深さがないため、2次元のオブジェクトです。
しかし、その隣の炭酸飲料の缶は立体物です。このソーダ缶は大きく、丸く（幅と高さ）、長い（深さ）。
同様に、コンピューターの3Dグラフィックスは本質的にフラットで、コンピューターの画面に表示されるのは2ビットの画像だけですが、奥行き（または3次元）の錯覚を与えることができます。（2D +遠近法= 3D）
元のコンピュータグラフィックスは（図1.2）に示したものと似ており、12本の線分が単純な3次元の立方体を形成しています。この立方体を3次元に見えるようにするのは、遠近法、つまり線分の間の角度です。深みのある錯覚を生み出すのは彼らです。
実際に3D画像を見るには、実際には2つの目で物体を観察するか、それぞれの目に独立した固有の物体の画像を提供する必要があります。（写真1.3）
それぞれの目が見るのは2次元画像であり、各網膜（目の後ろ半分にある）に一時的な写真を表示するのと非常によく似ています。その後、脳はこれら2つのわずかに異なる画像を組み合わせて、心の中で1つの合成された3D画像を形成します。
コンピュータの画面は、異なる視野角で2つの画像を表示するのではなく、平らな面に平らなポートレートを表示するためです。このように、ほとんどの3Dコンピューター画像は実際には約3Dにすぎません。
立体感を出すには、遠近法だけで十分です。前に示した立方体に注意してください（図1.2）。色が付いていなくても、立方体は3次元オブジェクトのように見えます。しかし、この立方体を長時間見つめると、立方体の前面と背面の位置が切り替わることがわかります。写真には表面の色がないため、脳はこれにより混乱しているように感じます。この写真は、脳が知覚するものを決定するのに役立つ十分な情報を提供していません。片目を覆ったときに見える世界が突然平らに見えるわけではありません。その理由は、2次元で見たときに、3D世界の効果の多くがまだ存在しているためです。これらの効果は、深さを識別する脳の能力を刺激するのに十分です。手がかりの1つは、露光によって引き起こされる表面の色であり、もう1つの手がかりは、近くにあるオブジェクトが遠くにあるオブジェクトよりも大きく見えることです（遠近効果）。この遠近効果は短縮と呼ばれます。この効果に加えて、色の変化、テクスチャ、照明、色付け、およびさまざまな色の強度が一緒になって、3次元画像の知覚を構成します。
1.23Dグラフィックステクノロジーと用語
この本の各章には、この章で説明されているプログラミング手法を示す1つ以上のサンプルプログラムが含まれています。この章では、プログラミングの詳細についての説明を意図的に避けていますが、読者がこの本を最大限に活用できるように、読者が最小限のプログラムで理解する必要のあるテクノロジと用語を読者に示すためのサンプルプログラムを提供しています。 。この章のサンプルプログラムはBLOCKと呼ばれ、読者は本に付属のサンプルプログラムセットの「第1章」フォルダにあります。（この例はGithubにアップロードされており、特定のリンクは記事の最後に掲載されます）
数学的およびグラフィックデータを3D空間画像に変換する操作は、レンダリングと呼ばれます。この用語を動詞として使用する場合、3次元画像を作成するときにコンピューターが実行するプロセスを指します。最終的なイメージ作品のみを指す名詞としても使用されます。この用語は、この本に頻繁に登場します。次に、レンダリングプロセス中に表示される他のいくつかの用語と操作を見てみましょう。
1.2.1変換と投影
（図1.4）は、BLOCKサンプルプログラムの元の出力を示しています。線で描かれ、テーブルまたは平らな面に配置された立方体を示しています。これらのポイントを変換または回転し、それらの間に線分を描画することで、フラットな2D画面上に3Dワールドのような錯覚を作り出すことができます。
これらの点自体は頂点（頂点、特異頂点）（用語：頂点）と呼ばれ、変換行列と呼ばれる数学的結果によって回転させることができます（この本の第4章では、変換行列の内容について詳しく説明します）。3D座標を2次元の画面座標に変換するために使用されるProjectionMatrixと呼ばれる行列もあります。実際の線も2次元の画面座標に描画されます。
1.2.2ラスタライズ
線分を形成するための各頂点間のピクセルの実際の描画または塗りつぶしは、ラスタライズと呼ばれます。Hide Surface Removalを使用すると、3D設計の意図をさらに明確にすることができます。（図1.5）は、BLOCKサンプルプログラムでスペースバーを初めて押した後の出力を示しています。ポイントとラインセグメントは引き続き使用されますが、テーブルに配置された立方体の錯覚はより現実的です（図1.4と比較して）。
線分を使用した描画[ワイヤーフレームレンダリングとも呼ばれます]には用途がありますが、ほとんどの場合、線分ではなく実線の三角形を使用してレンダリングします。線分と同様に、三角形とポリゴンもラスタライズまたは塗りつぶされます。初期のグラフィックハードウェアは三角形を単色で塗りつぶすことができますが、（図1.6）に示すように、これは3D錯覚を強化しません。初期のゲームやシミュレーション手法では、隣接するポリゴンに異なる単色を使用する場合があります。これは非常に役立ちますが、現実を納得のいくようにシミュレートすることはできません。
たくさん言った後でも、まだトピックが恋しいようですが、ラスタライズとは正確には何ですか？（理解できない読者はこのブログ投稿を読むことができます）
（図1.6）は非常にあいまいに見えるので、実行中のBLOCKの例のスクリーンショットを置きます
1.2.3シェーディング
（写真1.7）BLOCKを実行してスペースバーを2回押すと、シェーディングの効果が表示されます。サーフェスに沿って（頂点間で）カラー値を変更することにより、赤い立方体を照らす光の効果を簡単に作成できます。
照明とシェーディングは、3Dグラフィックスの専門分野で非常に大きな割合を占めており、それらに特化した本があります。一方、シェーダーは、頂点を処理し、ラスタライズタスクを実行するためにグラフィックハードウェア上で実行される別個のプログラムです。
また、（図1.7）効果が明確すぎるため、実行中のBLOCKの例のスクリーンショットを配置しました
1.2.4テクスチャマッピング
導入される次のハードウェア技術の進歩は、テクスチャマッピングです。テクスチャは、三角形またはポリゴンに貼り付けるために使用される画像にすぎません。（図1.8）で見たように、これらのテクスチャはレンダリングをまったく新しいレベルに引き上げます。
今日のハードウェアでは、テクスチャは高速で効果的であり、テクスチャで再現できる表面が三角形で実現されている場合、数千または数百万もかかる可能性があります。
この例では、BLOCKを実行した後、スペースを3回押すと、表示を切り替えることができます。
また、（図1.8）効果が明確すぎるため、実行中のBLOCKの例のスクリーンショットを配置しました
1.2.5ブレンディング
最後に、（図1.9）はブレンドの効果を示しています。混ぜるとき、私たちは異なる色を一緒に混ぜることができます。最初にこの立方体を逆さまに描画し、次にその上に床を描画してそれらと混合します。立方体を法線方向に描画することで、この反射効果を得ることができます。床の下に逆さまの立方体が見えました。脳は私たちに「ああ...これは反射だ」と言っています。ブレンドを適用して、オブジェクトを透明に見せることもできます。実際、（図1.9）で実際に見られる逆立方体は、実際には床から「透けて」見えます。
上記の描画手順について簡単に説明してください。
①逆立方体を描く
②床を描く（ミキシングを適用）
③法線方向に立方体を描く
また、（図1.9）効果が明確すぎるため、実行中のBLOCKの例のスクリーンショットを配置しました
1.2.6接続ポイント
全体として、全体として、全体として。上記の内容は、おそらくいわゆるコンピュータグラフィックスです。ソリッド3Dジオメトリは、頂点間のポイントを接続し、三角形をラスター化してオブジェクトをソリッドにすることに他なりません。変換、カラーリング、テクスチャ、ブレンディング---映画、テレビ、ゲーム、医療、または商用アプリケーションで見られるコンピュータレンダリングされたシーンは、これら4つのテクノロジーを柔軟に使用することに他なりません。
1.33Dグラフィックスの一般的な使用法
最新のコンピュータアプリケーションでは、3次元グラフィックスにはさまざまなアプリケーションがあります。リアルタイム3Dグラフィックスのアプリケーション範囲には、インタラクティブなゲームとシミュレーション、およびデータの視覚的表示（科学、医療、または商用アプリケーション用）が含まれます。ハイエンドの3Dグラフィックスは、映画や技術出版物、教育出版物でも広く使用されています。
1.3.1リアルタイム3D
前述のように、リアルタイム3Dグラフィックスとは、アクティブでユーザーと対話するグラフィックスを指します。（リアルタイムで更新される3Dグラフィックス）
リアルタイム3Dグラフィックスの最も初期の使用法の1つは、軍用フライトシミュレーターでした。今日でも、フライトシミュレーターは、多くのアマチュアによって熱狂的です。
（写真1.10）は、3DレンダリングにOpenGLを使用する人気のフライトシミュレーターのスクリーンショットを示しています（興味がある場合は、www.x-plane.comにアクセスして体験できます）。
1.3.2非リアルタイム3D
リアルタイム3Dアプリケーションでは、妥協する必要があることがよくあります。十分な処理時間があれば、より高品質の3Dグラフィックスを作成できます。
一般に、モデルとシーンを設計し、レイトレーサーまたはスキャンラインレンダラーを使用してこれらの定義を処理し、高品質の3Dグラフィックスを作成します。
一般的な処理プロセスは次のとおりです。
①リアルタイム3Dグラフィックスを使用してアーティスト（ユーザー）と対話し、特定のコンテンツを作成するモデリングアプリケーション。
②その後、作成したフレームを別のアプリケーション（レイトレーシングオフラインレンダラー）またはサブルーチンに送信し、画像をレンダリングします。レンダリングに時間がかかる場合があります。
例：非常に高速なコンピューターでは、映画（たとえば、クマ）の単一フレームのレンダリングに数時間かかる場合があります。数千のフレームをレンダリングして保存するプロセスにより、再生可能なアニメーションシーケンスが生成されます。このアニメーションシーケンスは、再生するとリアルタイムのように見えますが、そのコンテンツはインタラクティブではありません。したがって、リアルタイムではなく、事前にレンダリングされます。
1.3.3シェーダー
リアルタイムコンピュータグラフィックスでは、最も最先端のアートはプログラマブルシェーディングです。
今日のグラフィックカードは、もはや低電力のレンダリングチップではなく、強力で高度にプログラム可能なレンダリングコンピュータです。
毎年、シェーダーベースのグラフィックハードウェアは、システム上のハイエンドレイトレーサーおよび前述のソフトウェアレンダリングツールによって実行されるタスクに侵入し続けます。
（図1.16）は、SoftwareBisqueのSeeker太陽系シミュレーター上の地球の画像を示しています。
このアプリケーションは、カスタムOpenGLシェーダーを使用して、毎秒60フレームの速度でリアルな地球の動的画像を生成します。
また、大気の影響、水中での太陽の反射、さらには背景の星も含まれます。
1.43Dプログラミングの基本原則
これで、リアルタイム3Dの基本概念をかなり理解できました。PC上のいくつかの用語といくつかのサンプルアプリケーションについて説明しました。では、どのようにして自分のコンピューターでそのようなイメージを作成しますか？まあ、それは本の残りの部分の仕事です。ただし、読者はいくつかの基本的な知識も知っている必要があります。これについては次に説明します。
1.4.1ツールキットではありません
OpengGLは、基本的に低レベルのレンダリングAPI（アプリケーションプログラミングインターフェイス）です。
「どこに何を描くか」はわかりません-----三角形をロードし、必要な変換と修正テクスチャ、シェーダーを適用し、必要に応じてモデルを組み立てるためにブレンドモードを適用することで、自分で行う必要があります。
これにより、多くの低レベルの制御を実行できます。高レベルのツールキット（ゲームエンジン）を使用する場合と比較して、OpenGLなどの低レベルのAPIを使用する場合の感動的な点は、多くの標準的な3Dレンダリングアルゴリズムを再現できるだけでなく、独自のアルゴリズムを作成でき、さらにいくつかの新しいショートカットを発見できることです。 、パフォーマンススキルと芸術的な視覚技術。
1.4.2座標系
それでは、オブジェクトを3次元で記述する方法を考えてみましょう。
オブジェクトの位置とサイズを指定する前に、オブジェクトを測定して配置するための参照フレームが必要です。
単純なフラットコンピュータ画面に点や線を描くときは、行と列に基づいて位置を指定します。（例：x、y）
OpenGLまたはほぼすべての3DAPIで描画するためのウィンドウを作成するときは、使用する座標系と、指定した座標を実際の画面ピクセルにマッピングする方法を指定する必要があります。まず、2次元グラフィックスで何をすべきかについて説明し、次にこの原則を3次元グラフィックスに拡張します。
2Dデカルト座標
2次元図面で最も一般的に使用される座標系は、デカルト座標系です。デカルト座標系は、x座標とy座標で構成されています。
x座標は水平方向の位置を測定し、y座標は垂直方向の位置を測定します。
デカルト座標系の原点は（x = 0、y = 0）です。デカルト座標は括弧内の座標ペアで表され、最初の座標はx座標、2番目の座標はy座標、中央はコンマで区切られます。たとえば、原点は（0、0）と記述されます。
（図1.17）は、2次元デカルト座標系を示しています。スケーリングされたx線とy線は「軸」と呼ばれ、負の無限大から正の無限大まで伸びることができます。
この写真は、私たちが学校にいるときによく使用する実際のデカルト座標系です。現在、描画時に座標系を指定すると、ウィンドウマッピングモードが異なると、座標の解釈に一貫性がなくなる可能性があります。この本の後半の章では、実際の座標コントロールをさまざまな方法でウィンドウ座標にマップする方法を説明します。
座標クリッピング
ウィンドウはピクセル単位で測定されます。ウィンドウに点、線、および形状を描画する前に、指定した座標を画面座標に変換する方法をOpenGLに指示する必要があります。
ウィンドウを占めるデカルトコントロールの領域を指定することで、このタスクを実行できます。この領域は、クリッピング領域と呼ばれます。
2次元空間では、トリミング領域はウィンドウ内の最小および最大のx値とy値です。もう1つの方法は、ウィンドウに基づいて原点の位置を指定することです。
（図1.18）は、2つの一般的なトリミング領域を示しています。
最初の例:(図1.18の左側）
ウィンドウのx座標の範囲は左から右に0から+150で、y座標の範囲は上から下に0から+100です。画面の中央の点は（75、 50）。
2番目の例:(図1.18右側）
ウィンドウのx座標の範囲は左から右に-75から+ 75、y座標の範囲は上から下に-50から+50です。画面の中央の点は原点で表されます。 （0、0）。
もちろん、OpenGL関数（またはGDI描画の通常のウィンドウ関数）を使用して、座標系を上下または左右に反転することもできます。
実際、ウィンドウウィンドウのデフォルトのマッピングでは、座標のy値は常に正であり、上から下に向かって増加します（Win32はこのようなものです）。
このデフォルトのマッピングモードは、テキストを上から下に描画する場合に非常に便利ですが、グラフィックを描画する場合にはあまり便利ではありません。
ビューポート：図面の座標をウィンドウの座標にマップします
トリミングされた領域の幅と高さがウィンドウの幅と高さ（ピクセル単位）と正確に一致することはめったにありません。
したがって、座標系は、論理デカルト座標から物理画面のピクセル座標にマッピングする必要があります。このマッピングは、ビューポートと呼ばれる設定を介して指定されます。
ビューポートは、トリミングされた領域を描画するために使用されるウィンドウ内のクライアント領域です。ビューポートは、トリミングされた領域をウィンドウ内の領域にマップするだけです。
通常、ビューポートは実際のウィンドウとして定義されますが、これは厳密には必要ありません。たとえば、ウィンドウの下部にのみ描画したい場合があります。
（図1.19）は、300x300ピクセルのサイズの大きなウィンドウを示しており、そのビューポートはユーザー領域全体として定義されています。
このウィンドウのトリミング領域がx軸に沿って0から150、y軸に沿って0から100に設定されている場合、このウィンドウの論理座標はより大きな画面座標系にマップされます（トリミング領域が大きいため）ビューよりも小さい口）。
論理座標系の各増分は、ウィンドウの物理座標系（ピクセル）の2つの増分と一致します。
対照的に、（図1.20）は、クロップに一致するビューポートを示しています。私たちが見るウィンドウはまだ300x200ピクセルです。ただし、表示領域はウィンドウの左下部分を占めます。
ビューポートを使用してウィンドウ内の画像を縮小または拡大したり、ビューポートをウィンドウのユーザー領域よりも大きく設定して、トリミングされた領域の一部のみが表示されるようにすることができます。
頂点-----空間内の位置
2Dおよび3Dでは、オブジェクトを描画するときに、実際にはプリミティブ（点、線）と呼ばれるいくつかの小さな形状を使用してオブジェクトを構成します。
プリミティブは、点、直線、複数の表現（フラットで変更可能な形状）など、1次元または2次元のエンティティまたはサーフェスです。
3D空間では、プリミティブを組み合わせて3Dオブジェクトを作成します。たとえば、3次元の立方体は6つの2次元の正方形で構成され、各正方形は独立したサーフェスを表します。
正方形（またはその他のプリミティブ）の各コーナーは、頂点と呼ばれます。これらの頂点は、3D空間の特定の座標を指定します。
頂点は、実際には2Dまたは3D空間の座標です。立体的な3D幾何学図形を作成することは、実際には接続ゲームにすぎません。
すべてのOpenGLプリミティブとその使用方法については、第3章で説明します。
3Dデカルト座標
ここで、2次元座標系を3次元空間に拡張し、深さ成分（深さ）を増やします。
（図1.21）に示されているデカルト座標系は、新しい軸であるZ軸を追加します。Z軸はx軸とy軸の両方に垂直です。
これは、画面の中心からリーダーに向かう直線を表します（この座標系の遠近法を回転させ、y軸を左に回転させ、x軸を上下に回転させました）。
そうしないと、Z軸が直接向き、Z軸が見えなくなります。ここで、3つの座標（x、y、z）を使用して、3次元空間内の位置を指定します。
例:(図1.21）は点（-4、-4、-4）を示しています。
1.4.3投影：3Dから2Dへ
デカルト座標を使用して3D空間の位置を表す方法はすでに知っています。
しかし、私たちが目で見る3次元画像がどれほどリアルであっても、画面上のピクセルは実際には2次元にすぎません。
では、OpenGLはこれらのデカルト座標を画面に描画できる2次元座標にどのように変換するのでしょうか。
要するに、答えは「三角測量と単純な行列操作」です。
シンプル？
実際、そうではないかもしれませんが、概念について長い時間をかけて議論すると、これらの詳細に興味のない多くの読者を失う可能性があります。
（これについては、第4章で少し説明します。より詳細な説明については、付録A「その他の読み物の提案」の参照セクションを参照してください）。
幸い、OpenGLを使用してグラフィックを作成する場合、数学を深く理解する必要はありません。ただし、この分野での成果が深ければ深いほど、OpenGLをより強力に使用できます。
私たちが本当に理解する必要がある最初の概念は、プロジェクションと呼ばれます
コレクショングラフィックの作成に使用される3D座標は、2Dサーフェス（ウィンドウの背景）に投影されます。（図1.22）
正射影
OpenGLでは、ほとんどの場合、私たちが気にする2つの主要なタイプのプロジェクションがあります。
1つ目は、OrthographicsProjectionまたはParallelProjectionと呼ばれます。
この種の投影を使用する場合、正方形または長方形の表示ボリュームを指定する必要があります。
表示ボリューム外のオブジェクトが描画されます。また、実際のサイズが同じであるすべてのオブジェクトは、遠くにあるか近くにあるかに関係なく、画面上で同じサイズになります。
このタイプの投影（図1.23）は、建築設計、コンピューター支援設計、または2Dグラフィックスで最も一般的に使用されます。
さらに、3Dグラフィックスシーンでは、正射影を使用して、シーンの上にテキストまたは2Dオーバーレイを追加する必要があることがよくあります。（ゲームGUI）
透視投影
2番目のタイプの投影法は、より一般的な透視投影法です。
この種の投影では、遠くのオブジェクトは近くのオブジェクトよりも小さく表示されます。彼の視覚的な体（図1.24）は、上部が平らなピラミッドのように見えます。
残りの形状は錐台（錐台）と呼ばれます。表示ボリュームに近いオブジェクトは、元のサイズに近く見えます。ただし、表示ボリュームの後ろにあるオブジェクトが表示ボリュームの前に投影されると、ドアのセットは小さく見えます。シミュレーションや3Dアニメーションでは、この種の投影により、最高のリアリズムを実現できます。
この本のすべての例のソースコードは、Githubに配置されます。詳細なアドレス：Github-OpenGL-Example
この章のBLOCKのサンプルソースコードの詳細なアドレス：Github-BLOCK