先日は、

 

 

にてベクターグラフィックについて書きました。

 

 絵を描く場合には、平面上に図形を描くことで形を再現することになりますが、形には基本形状があるので、その組み合わせで考えると形を取りやすくなります。

 

 こうした処理は、デジタルでも行えますが、グラフィックツールには整数座標の制御をするラスターグラフィックだけではなく、座標を小数点数で制御できるベクターグラフィックもありますが、こうしたツールは形状の組み合わせの処理が得意なので、基本形状の組み合わせで形を作る考え方で絵を描くことが出来ます。

 

 形の合成については、義務教育の図形のカリキュラムで登場しますが、この中で、

 

  ■ 面積

  ■ 体積

 

を出す方法を学習しますが、この時に複数の形状を組み合わせてできる図形の面積を求めることになります。

 

 このカリキュラムでは、

 

 

のような2つの図形があり、

 

 

のように組み合わせた時の形状の面積を出すことになりますが、

 

 

の2つの面積を出して加算すると、

 

 

の重複部分が発生するので、この重複した部分の面積を除去することで

 

 

の面積を出すことができます。義務教育ではこの処理を図形というデータの集まりを使用して、データの条件抽出の方法として面積や体積として扱っているているわけですが、面積や体積は 【 物体の持つデータの総数を示したもの 】 なので、これは加工しない限りは変化しませんから、定数のデータとして形状が持ち合わせているものになリます。現実世界だと物体には質量がありますから、体積を出すことで

 

  ■ 質量

  ■ 容積

 

を出すことが出来ます。また、柱のように線形の変化が生じるような立体の場合、底辺の面積が分かっていれば、

 

  ■ 直線 : 定数のグラフ

  ■ 車線 : 一次関数

 

のような変化を刷る場合でも、対応できますから、面積を求めておくと、その面の積層部分の層の変化を追加するだけで堆積を出せるので、1次元の変化を追加することで堆積を出すことが出来ます。

 

 面積は 【 範囲 】 を示したものなので、この構造物は、不等式を使用して上限と下限を用意したものになります。例えば、絶対値を使うと

 

 

のようになりますし、単位円を使うと

 

 

のようになります。また、単位円とsin(x)だと

 

 

のような範囲指定が出来ます。これが図形居なりますが、

 

 

のような状態は【 条件の設定 】 ですから、

 

【 面積というデータの集合 】

 

に対して判定を行うものになります。

 

 その為、これは、高校の数学Cで学習する集合と論理の中で使用する集合演算を用いた処理になります。

 

 集合演算については、

 

 

 

 

 

 

の中でも触れていますが、グラフィックでも集合演算は使用します。ベクターグラフィックツールには色々な種類がありますが、OSSのツールにInkscapeがあります。

 

 

 ベクターグラフィックでは、

 

  ■ 外形線 : ストローク

  ■ 塗 り : フィル

 

で構成されおり、頂点座標を少数点数で指定できるので拡大・縮小や回転などを行っても形状が破綻することはありません。また、ラスターグラフィックが苦手とする曲線や車線を生成してもドットの角が存在しないのでジャギーが出ることもありません。

 

 また、ベクターグラフィックは、ラスターグラフィックとは事なり、オブジェクト単位で管理できるので、単一のレイヤー内に階層を設けることが出来ます。また、これをレイヤーで管理できるので、レイヤーパレットで階層を変更する個tも出来ます。通常のベクターグラフィックツールだとそうなっていますが、ペイント3Dでは、簡素化されていますが、3D図形にすることでベクターグラフィックで作業できるようになっています。これについては、

 

 

の中で触れていますが、3D形状を作ることで、オブジェクトを独立させて奥行きの調整で前後の位置関係を指定してレイアウト時の階層をコントロールできるようになっています。

 

 ベクターグラフィックでは、

 

 

のようにオブジェクトを用意するとオブジェクト単位で管理できるので、

 

 

の用に重ねることが出来ますが、この際に階層構造を変更できるので、

 

 

のように改造を入れ替えることも出来ます。これがレイヤーではなく、オブジェクトの階層の情報だけで変更できるのがベクターグラフィックの特徴になります。また、集合演算もできるので、

 

 

 

 

のような事も出来ますが、ベクターグラフィックは描くと言うよりも作ると言うイメージが強いツールになります。

 

 とは言っても、手書きが出来るカリグラフィーなどもあるので、カリグラフィーで描くような文字を手書きで追加する事も出来ますが、21世紀になってからは、デジタルでのコミック制作ツールなどで 【 ベクターレイヤー 】 が実装されたので、現在は手書きでもベクターの処理が出来るようになっています。

 

 その為、

 

  ■ 下書き : ラスター

  ■ 線 画 : ベクター

  ■ 塗 り : ラスター

 

のように使い分けて作業が出来るようになっています。こうした2つのレイヤーが1つのソフトで使用できるようになっていますが、現在は3Dレイヤーも実装しているものもあるので、実質的に、

 

  ■ ラスターラスター

  ■ 2Dのベクター

  ■ 3Dのベクター

 

が使用できる王になっていますから、3D作画や3Dのオブジェクトをレイアウトして使用できるようになています。

 

 ペイント3Dもオブジェクトを配置してラスターを使える仕様になっているので、レイヤーはありませんが、ベクターグラフィックの1枚のレイヤーを使って3つのオブジェクトを使用できるようになっています。

 

 ベクターグラフィックでは形状の組み合わせで絵を描くので、アナログで描く時の形を取る作業と同じ方法で形を作っていくことが出来ます。

 

 例えば、

 

 

のような形を作る場合、

 

 

のように円と矩形を組み合わせれば作れますが、この時の円の形を変えると

 

 

 

のように始点が変わったように見えます。実際には楕円ではなく、前後で奥行き方向の距離が違う円弧を組み合わせた経常を描く必要があるので、歪ませる必要がありますが、楕円の変化で視点による変化が生じたように感じると思います。

 

 これをした方向に追加すると、

 

 

のようになりますが、この状態だと透過している用に感じると思いますが、色をあ合わせると、円柱に見えます。

 

 

上の楕円に小さな楕円を追加すると

 

 

のように見えますが、この下の部分二影を入れると、

 

 

のように物体に見えてきます。これだと影が強いので、

 

 

のように系統色に変更する事も出来ますが、影の方向の色を暗くすると

 

 

の用になります。これだと曲面的な変化がないのでグラデーションを入れると
 
 
のような感じになります。ここに少し調整を入れると
 
 
のようになります。
 

 先程の事例は柱でしたが、先端が尖った円錐や四角錐の場合、

 

 

のように円や多角形と三角形を組み合わせて作るkとが出来ます。また、これを延長する際には、

 

 

のように同じ面を用意して矩形でつなげると延長できます。

 

 

 4つの角が直角な四角形を用意すると壁のような印象を受けますが、ひし形を作ると正面以外の角度を感じるようになります。その為、

 

  ■ 天井

  ■ 床

  ■ 壁

 

のような形状として使用できます。例えば、ひし形を敷き詰めると、

 

 

のようになるので、床のような印象を受けると思いますが、これは堆肥となるものの接地面に見える場所とひし形の並んでいる位置関係からそのように認識してしまうわけです。

 

 また、色彩と形状の関係性だと、

 

 

のようにすると、立方体のような形状に見えますが、これを配置すると

 

 

のようになるので、空間を感じると思います。高さの表現をする場合だと、

 

 

のようにした方向に面を作ってつなげることになりますが、このような構造だと四角形の組み合わせだけで空間の表現をすることが出来ます。

 

 

 

 

 TODAY'S
 
遠近法

 

 先日は立体感について触れましたが、デザインをする場合だと

 

  ■ 菱形の集合 : 立方体

  ■ 円形状   : 球体

 

を作れるようになっていますが、平面の集合で絵を考える場合には、対象物がどのような集合で構成されているのかを知ると再現しやすくなります。

 

 絵を描く場合には消失点の概念があるので、パース方向への縮小が生じますが、これを遠近法で再現することになります。

 

 

 

  立体と遠近法

 

 絵空間を表現する場合には、

 

  ■ 視点

  ■ パースによる変化

 

を考える必要がありますが、遠近法を使わない場合だと、

 

 

 

のような表現が出来るので、

 

 

のように形状の集合で区間を作ることが出来ます。

 

 現実世界では遠くになるほどものは小さく見え、近くになるほど大きく見えるのですが、この法則は、相似の三角形の底辺の長さの変化で再現できます。実際に、相似の三角形を用意して色分けをしてみると

 

 

のようになりますがこの時の頂点が見ている視点の高さで、この点のことを消失点といいます。一点透視図法では、この点に向かって収束するような仕組みを使うことになるので、

 

のような感じになります。これは、先程の形状を上下で並べて、矩形で仕切っただけですが、白い壁があって、億に道が繋がっているように見えると思います。これが遠近方法を用いた遠近感の表現になります。

 

 この事例では全ての面が消失点に向かっていますが、遮蔽物を追加することで、

 

のように平面の並びの中に奥行きのある状態を作ることも出来ます。

 

 この事例では消失点が決まっているので、その高さで物を見ていますが、視点の高さを変えると

 

 

のように見える部分が変わってきます。この状態は上を向いているのかしたを有無居ているのかの違いになりますが、この時の視点の高さを示すラインが 【 アイレベル 】 になります。

 

 その為、透視図法の場合、

 

  ■ 視点の高さを決める

  ■ アイレベルを用意する

  ■ アイレベル上に消失点を配置する

  ■ オブジェクトのパースを取る

 

という流れになります。これは消失点の数が増えても同じですが、二点透視図法の場合だと、

 

 

のようになります。二点透視図法は、角が基準になる描き方なので、建物の端の角の直線を基準として描く場合に使用できます。屋内の撮影をする際のは部屋の角の柱を基準に視点を作るような構図だったり、建築パースで建物の角が正面を向いているような描き方をする場合もこうしたパースのとり方をします。透視図法は多くの消失点がある条件から情報を減らしていったものになりますが、基本は三点なので、

 

 

  ■ 一点 : 二軸の変化を排除

  ■ 二点 : 高さ方向の情報の排除

  ■ 三点 : 三軸の情報を使う

 

 

と言う仕様になっています。その為、

 

  ■ 一点 : 面

  ■ 二点 : 線

  ■ 三点 : 点

 

を基準にパースを取ることになります。

 

 透視図法を使うと、空間内の奥行きによる変化だけでなく、高低差の表現もできるので、

 

 

 

のような空中のものや地上のものをパースをつけた状態で管理できるようになっています。

 

 

 

  絵の構造

 


 中学校の美術では様々な画法が登場しますが、絵を描く時の基本的な考え方は同じです。絵を描く場合、

  ■ 視覚情報 : 立体
  ■ 再  現 : 平面

ですから、視差から得た奥行きの情報がある状態から平面の状態に変換したものを取得して再現することになります。

 絵を描く作業は、3DCGのレンダリングと似たような状態に鳴っていますが、人の場合、視線から直線的な情報を取得してそのデータをピクセルに起こしているわけではありませんから、平面にした時の情報に変換して再現することになります。

 現実世界の空間な立体形状の集合なので、この情報を平面にする場合、平面で見た時の長さと向きで線分を取得して描くことになります。

 この処理を行う場合、

  ■ 直線である
  ■ 直線ではない

という二値で判断することになりますが、基準となるのは、直線なので、

  ■ 2つの座標が存在する
  ■ 2つの座標が結ばれている

と言う条件が満たされたものになります。これが位置ではなく距離と言う概念になりますが、絵の構成要素は線分なので、線画を描く場合には、この

  ■ 位置
  ■ 距離

の2つの情報を用いることになります。線分と言う距離の情報で考えると、これは幾何ベクトルと同じなので、

  ■ 大きさ
  ■ 向き

で考えることができます。しかし、これを三角関数で使用する三角形の斜辺として考えた場合、

  ■ 原点
  ■ 単位円上の座標

と考えることができるので、向きについては座標の変化だけで対応できることが確認できます。

 距離の変化は、係数の変化ですから、幾何ベクトルの制御と全く同じになりますが、これを用いると、 【 座標の指定 】 だけで線分の状態をコントロールすることができます。
 

 

 

  座標制御と考え方



 座標の制御ですが、線分を用意した場合、

  ■ 始点
  ■ 終点

という2つの座標を用意することになります。この時に、

  ■ 始点 : 座標A
  ■ 終点 : 座標B

と言う名称をつけて考えた場合、

【 線分の移動 】

  座標A+α ∧ 座標B+α


【 線分の移動 】

  座標A+α ∨ 座標B+α

のような条件になります。当然、この変化の量を示すαは一次元ではなく、二次元ですから、

  ■ x座標
  ■ y座標

の変化を示したものになります。その為、


【 線分の移動 】

  座標Aと座標Bのx,y座標が同じ定数分だけ
  加算された状態
  (符号による制御あり)


【 線分の拡大・縮小 】

  座標A、もしくは、座標Bのいずれかのx,y
  座標が定数分だけ加算された状態
  (符号による制御あり)


と考えることができます。こうした変化は始点を固定したほうがわかりやすいいので、始点を原点に固定した状態で考えると、

 終点の座標の変化で生じた現象

と考えることができます。この原点ベースの座標の考え方はベクターグラフィックではグローバル座標を用いたものになります。

 数学だと0からの距離は絶対値として扱いますが、数式の計算結果が定数項で表記されている場合、この時の数値は絶対値と同様に0からの距離で確立されたものになります。その為、結果が決まったものについては、原点座標からの距離で示したものを扱うようになっています。

 これに対し、アルゴリズムのように変化が生じる場合には、結果に対して何かしらのものを追加するので加算をおこなうことになりますが、この時の

 【 加算する対象の始点 】

は原点ではなく 【 処理を追加する前の座標 】 になります。数式で考えると、これは計算前に存在する計算結果になりますが、幾何ベクトルで考えると、この座標は合成後のベクトルの位置になります。

 ベクターグラフィックでは、原点ベースで考えるグローバル座標だけでなく、計算を行う際に使用する何かしらの値を追加した状態の始点を指定できるように鳴っていますが、この原点以外の場所を基準とした座標のことを 【 ローカル座標 】 と言います。

 義務教育だと

  ■ 定数項  : グローバル座標
  ■ 一次関数 : ローカル座標

のような構造に鳴っていますが、一次関数も単項式の構造のy=xの場合だと、原点からスタートしますが、これが、多項式になってy=x+bのような構造になると、bを加算した場所が原点座標になるので、座標平面上の原点である(0,0)とは異なる場所にx=0のときの値が発生します。その為、y切片はプログラミング言語の変数の初期化と同じ効果を持つものと考えることができるわけですが、このように原点以外の座標からスタートするものは義務教育の数学でも登場します。

 ローカル座標を使用すると、位置情報を変更できるので、元の状態を維持して終点だけでなく始点まで移動した状態で考えることができるので原点から発生した幾何ベクトルと並行移動もできますし、これを一次元ではなく二次元で移動させることもできます。

 この変化を適応すると、

  ■ 大きさ
  ■ 向き
  ■ 位置

の変更が行えるようになります。その為、位置情報の変更はローカル座標を基準とした物になりますが、高校の数学では、f(x)=|x-1|のように変数xの部分を一次関数の構造にすることで、関数のx軸上での移動ができるようになります。その為、

  f(x)=|x-p|+q

のようにすると、

  ■ 変数p : x軸の移動
  ■ 変数q : y軸の移動

を制御することができます。これが関数の変化になりますが、座標については、定数で指定した値の変化で対応できるので、始点と終点の座標を変数に置き換えると、幾何ベクトルの状態をコントロールできるので、線分の始点と終点のローカル座標を取得すると絵の中に存在する直線の情報を描くことができるように鳴っています。

 

 

 

 

  座標と曲線

 
 線分には直線と曲線がありますが、曲線の定義は曲がった線なので、この構造の最小単位は関節のような構造が存在する物になります。
 
 そうすると、二点では無理なので、最小構成は三点になりますから、2つの幾何ベクトルを連結した構造になります。

 頂点座標を3つ用意すると

  ■ 曲線の要素
  ■ 多角形の要素

を取得できるのですが、曲線の場合、最小構成は三角形の頂点と残りの頂点を結んだ線分と同じものと考えることができるので、曲線の成分を見ると、

  ■ 直角二等辺三角形
  ■ それ以外の三角形

になっています。ちょ書く二等辺三角形を曲線補完をすると円弧になりますが、頂点を基準として左右で傾きが異なる場合2つの異なる傾向で構成された曲線の集合体と考えることができます。

 絵を描く場合、位置情報を取得してアタリを取ることになりますが、曲線の場合、傾向を取得してから細分化をし得地区事になります。

 この考え方は、数学だとヒストグラムを正規分布のグラフにするようなイメージですが、ヒストグラムもデータ単体で見ると一つの塊ですが、階級で分類して値を集計することで矩形の集合に変化します。

 これはサンプリング数の少ない集計データでも同様の粗さが出るので、これを極限まで小さくしてサンプリングをすると矩形の集合は非線形の形に変化していきます。ヒストグラムの状態を細分化して非線形のグラフの状態にしたような構造物が高校の数学の仮説検定の判断基準として使用する正規分布のグラフになりますが、絵の場合も座標の制御になるので、ヒストグラムではなく複素数平面上の指数による超点数の変化と同様の物をイメージすると解りやすいかもしれません。

 曲線を描く場合には、最初に

  ■ 基準となる頂点部分
  ■ 曲線の始点と終点

の3つの座標を最初に取得します。そして、その後、始点と終点を繋いで線分を作り、頂点から垂線を伸ばします。こうすることで、2つの三角形で構成された構造が出来上がりますが、ここから、

  ■ 端の頂点
  ■ 中央の頂点

でできた線分を等間隔で区切ります。この分割した部分はサンプリングようの頂点になるので、ここから垂線を伸ばしておいて、基準からの距離を追加すると、曲線の構成要素となる頂点を取得できます。

 絵の場合、フリーハンドで描くので、曲線を再現しやすい数だけサンプリングを行ってから曲線のアタリを追加してそこから破綻しないように補完をして描くことになります。

 サンプリング数を増やせば頂点間の傾きの精度を上げることができますが、この辺りは3DCGでパストレーシングでレンダリングした時の品質を上げる方法と同じです。

 曲線の考え方は曲がったものなので、最小構成は三つの頂点になりますが、この情報を線分でつなぐので幾何ベクトルの集合として考えることができます。ただし、この方法で直線補完をすると3DCGのローポリモデルのようにエッジが立ってしまいますから、フリーハンドで曲線になるように調整して描くことになります。

 

 今回もコピー紙に描いており、Panasonic Lumuix DMC-TZ85で撮影しています。