UnitaryJSで五芒星を描く

UnitaryJSを使えば星を描くのも簡単です。

プログラム

const r = 30;
const goldenRatio = 1 + (1 + Math.sqrt(5)) / 2;
const star2 = new Polygon(
      new Point(r * Math.cos(theta * 0 + Math.PI / 2), r * Math.sin(theta * 0 + Math.PI / 2)),
      new Point(r / goldenRatio * Math.cos(theta * 3 - Math.PI / 2), r / goldenRatio * Math.sin(theta * 3 - Math.PI / 2)),
      new Point(r * Math.cos(theta * 1 + Math.PI / 2), r * Math.sin(theta * 1 + Math.PI / 2)),
      new Point(r / goldenRatio * Math.cos(theta * 4 - Math.PI / 2), r / goldenRatio * Math.sin(theta * 4 - Math.PI / 2)),
      new Point(r * Math.cos(theta * 2 + Math.PI / 2), r * Math.sin(theta * 2 + Math.PI / 2)),
      new Point(r / goldenRatio * Math.cos(theta * 0 - Math.PI / 2), r / goldenRatio * Math.sin(theta * 0 - Math.PI / 2)),
      new Point(r * Math.cos(theta * 3 + Math.PI / 2), r * Math.sin(theta * 3 + Math.PI / 2)),
      new Point(r / goldenRatio * Math.cos(theta * 1 - Math.PI / 2), r / goldenRatio * Math.sin(theta * 1 - Math.PI / 2)),
      new Point(r * Math.cos(theta * 4 + Math.PI / 2), r * Math.sin(theta * 4 + Math.PI / 2)),
      new Point(r / goldenRatio * Math.cos(theta * 2 - Math.PI / 2), r / goldenRatio * Math.sin(theta * 2 - Math.PI / 2))
    ).setFillColor('yellow');

解説

といっても大してすることもないですが。

まあなぜ黄金比(goldenRatio)が出てきたのかだけ説明します。

五芒星 - Wikipedia

wikiの画像中の青い線は、頂点を結んだ外側の五角形の1辺と長さが等しいです。そして、内側の五角形の1辺は紫の線です。

紫の線 : 緑の線 = 1 : (1 + sqrt(5)) / 2です。そして、 青の線 = 紫の線 + 緑の線 です。以上から、内側の五角形と外側の五角形の辺の長さの比がわかりました。

これが、黄金比で割っている理由です。