JavaScriptで3点が同一線上（共線）にあるかどうかを判定する方法

共線点（Collinear Points）とは

同じ一本の直線上に存在する3つ以上の点は、「共線点」と呼ばれます。

そして、3点が同一の直線上にあるかどうかは、それらの点から作られる3組の線分すべての傾きが等しいことで判断できます。

例として、2次元平面上の任意の3点 A、B、C を考えてみましょう。これらの点が同一線上にあるための条件は次の通りです。

ABの傾き ＝ BCの傾き ＝ CAの傾き

直線の傾きとは

直線の傾きは、一般的にx軸の正方向に対して直線がなす角度のタンジェント（正接）として定義されます。

また、直線上の2点、たとえば A(x1, y1) と B(x2, y2) の座標がわかっている場合は、次の式から傾きを計算できます。

ABの傾き ＝ (y2 − y1) / (x2 − x1)

この性質を利用すれば、3組の線分それぞれの傾きを比較することで、3点が共線しているかどうかを簡単に判定できます。

それでは、実際に関数のコードを書いてみましょう。

コード例

以下がその実装コードです。

const a = {x: 2, y: 4};
const b = {x: 4, y: 6};
const c = {x: 6, y: 8};
const slope = (coor1, coor2) => (coor2.y - coor1.y) / (coor2.x - coor1.x);
const areCollinear = (a, b, c) => {
    return slope(a, b) === slope(b, c) && slope(b, c) === slope(c, a);
};
console.log(areCollinear(a, b, c));

出力結果

コンソールには次のように表示されます。

true

この例では、点 A(2, 4)、B(4, 6)、C(6, 8) はすべて傾き1の直線 y = x + 2 上に存在するため、areCollinear 関数は true を返します。

なお、座標値が整数の場合でも除算による誤差が生じる可能性があるため、実用的なコードでは厳密な等価比較（===）の代わりに、許容誤差（イプシロン）を用いた比較を行うのがより安全です。