Processing 円 circle()とellipse()の違いとellipseMode()

learning_processing

今回はProcessingについて書き溜め、
円形を描く際に使うcircle()とellipse()との違いについてまとめる。
おまけでellipseMode()についても書いておく。

広告

circle()とは

円を描画: circle(中心のx座標, 中心のy座標, 幅と高さ)

circle()は円を描画する関数です。
最初の2つのパラメータは中心の位置(x座標, y座標)を設定し、
3番目のパラメータは図形の幅と高さを設定します。
原点はellipseMode()関数で変更することができます。

ellipse()とは

楕円を描画: ellipse(x座標, y座標, 幅, 高さ)

ellipse()は楕円を描画する関数です。
最初の2つのパラメータで位置(x座標, y座標)を設定し、
3番目と4番目のパラメータで図形の幅と高さを設定します。
原点はellipseMode()関数で変更することができます。

ellipseMode()とは

円の描画位置を変更する関数

ellipseModeはcircleとellipse関数で描画する円の座標位置を変更する関数です。
長方形の座標位置を変更するrectMode()については過去記事をどぞ。

ellipseModeのパラメータは4つあります。

  • CORNER
  • CORNERS
  • RADIUS
  • CENTER

ellipseMode(CENTER)

デフォルトは、ellipseMode(CENTER) で、
ellipse() の最初の2つのパラメータを図形の中心点(x座標, y座標)として解釈し、
3番目と4番目のパラメータを幅と高さとします。

ellipseMode(RADIUS)

ellipseMode(RADIUS)もellipse()の最初の2つのパラメータを図形の中心点(x座標, y座標)として解釈しますが、
3番目と4番目のパラメータは図形の幅と高さの半分を指定します。

CENTERとRADIUSの違いに注意! DADIUSの3,4パラメータは半径!

ellipseMode(CORNER)

ellipseMode(CORNER)は、ellipse()の最初の2つのパラメータを図形の左上隅(x座標, y座標)として解釈し、
3番目と4番目のパラメータを図形の幅と高さとして指定します。

CENTER等と違い、1,2パラメータが「図形の左上隅」であることに注意

ellipseMode(CORNERS)

ellipseMode(CORNERS) は、ellipse() の最初の2つのパラメータを楕円の外接枠の1つの角の位置(x座標, y座標)として、
3番目と4番目のパラメータを反対側の角の位置(x座標, y座標)として解釈します。



circle, ellipse, ellipseModeに関する詳しい情報は公式をどうぞ。
circle()
ellipse()
ellipseMode()



じゃあね〜〜〜〜。