位置の情報を数値で表す『座標』

平面や立体の空間に描画処理を行う場合、その空間上の位置を特定する情報が必要になります。

、、というと少し難しく聞こえますが、

例えば画用紙の上に線を引く場合ですと、まず最初に「どこから線を引くのか」という『開始位置』と、

「どこまで線を引くのか」という『終了位置』が、情報として必要になります。

そして、『開始位置』から『終了位置』に向かって線を引くことができます。

この、画用紙の上の『開始位置』と『終了位置』を、数値で表したものが『座標』になります。

座標の構成要素

では、その位置の情報をどうやって数値で表すのでしょうか?

みなさんは将棋をやったことがありますか?
将棋盤を見てみると、盤の端に数字が書かれています。

これは、将棋盤のマス(9×9の81マス)の位置を表現するため、「縦の列がどこで、横の段はどこか」を数値で表せるようにしたものです。

縦の列は、右から順に算用数字で「1、2、3…」と割り当て、横の段は、上から順に漢数字で「一、二、三…」と割り当てています。
そして、例えば将棋盤の一番右上のマス目は「1一」(縦の列が「1」で、横の段が「一」のマス)で、一番左下のマス目は「9九」(縦の列が「1」で、横の段が「一」のマス)と表します。

このように、縦の位置と横の位置に数字を割り当てれば、この2つの数字の組み合わせで平面上での位置を表現することができますね。

Scratchに登場する座標

それでは、Scratchのステージでは、どのように座標の数値が割り当てられているのか見てみましょう。

Scratchの背景のライブラリの中に、座標が記された「xy-grid」という背景があります。

【Scratch 2.0の場合】

【Scratch 1.4の場合】

この背景を適用すると、以下のようになります。

将棋盤のマスの位置を表す数値は、マスの数と同じ、縦9・横9でしたが、プログラミングで使用する空間(Scratchの場合はステージ)では、数値1つ分が将棋盤のマスに比べて非常に小さいものになります。

そして、横方向の位置を示す数値を「x座標」、縦方向の位置を示す数値を「y座標」と呼びます。

Scratchのステージでは、x座標は左端を-240として、右に向かって数値が大きくなり、右端が240となります。
y座標は下端を-180として、上に向かって数値が大きくなり、上端が180となります。

そして、x座標・y座標それぞれの真ん中となる、ステージの中心が「x座標:0、y座標:0」となります。

この座標を使って、オブジェクトを配置したり、動かしたり、また線などを描画したりすることができるのですね。

3次元の座標

これまで見てきた将棋盤やScratchのステージは平面でした。では、3次元(立体)の空間ではどうでしょうか?

平面上の位置は「縦」と「横」で表すことができましたが、3次元では「高さ(縦)」と「幅(横)」に加え、「奥行き」が追加されます。

座標でいうと、「x座標(幅)」「y座標(高さ)」「z座標(奥行き)」となります。

以前の記事「ブラウザでかんたん3Dモデリング『3DC』」でご紹介した、3DCの画面を見てみますと、

赤い矢印が「x座標(幅)」、緑の矢印が「y座標(高さ)」、そして青の矢印が「z座標(奥行き)」となっています。

『座標』と聞くと、なんだか数学の授業を受けているような気分になりますが、慣れれば決して難しいものではありませんので、みなさんもScratchや3DCで座標に馴染んでいきましょう。