JavaScriptによる図形の描画

最近、javascriptでなんじゃかんじゃと記述している。
それで、発見した。
すべての正多角形は、それに接する任意の半径rを与えれば、
頂点ごとに積分してやれば、図が完成するということを。
ただ、奇数の正多角形のほうが記述するときにより、
頭を使うというだけである。

現在は、円(真円、楕円も可能)と六角形が描画できるようになった。
以下に示す。

真円
一つの放物線を、0から2r(直径)まで積分すると描画できる。

六角形
Y=4Xを、0からr/2まで積分、Y=2rを、0からrまで積分、
Y=2r-4Xを、0からr/2まで積分すると描画できる。
この六角形に円が内接する。

描画するとき、真ん中に来るようにしている事で、
余分に倍X軸が傾くようになっている。(横軸をX軸にしている)
すなわち、半分だけ考えて、2倍している。
ちなみに、「+Y+」の所に、後で、2倍することも可能である。

五角形
傾き、高さ、幅を半径rで描写しようとしたら、
頭が痛くなってきたので、あきらめた。
目分量で、だいたい、正五角形に近いんじゃないかと、
思うものを、ここに公開する。
ちなみに、画像を1ピクセル×1ピクセル以外ので、
描写してみると、幻想的な図柄になる。
今回の一例を参考に色々と試して欲しいと思う。

六芒星
ダビデの星というのをご存知だろうか?
イスラエルの国旗になっていて、
魔法陣にも使われる。正三角形、二つを組み合わせて作る、
マークである。
透過GIFと青色単色のGIFとレイヤーを使用して、
作成してみた。
型崩れせずに、図形を描くには、「SVG」というファイル形式で、
記述するそうだが、こういう方法もあるという例を示す。

ハート
HTMLでは、ネームエンティティ♥で記述できるそうであるが、
自分なりに作ってみた。
お尻の形みたいになってしまったが、関数を組み合わせて力作のつもりである。
ちなみに、温泉マークは、ナンバーエンティティで記述できるそうで、
♨これも記述してみたい素材の一つである。

What's new?へ戻る   正多角形の面積へ戻る