JavaScriptとcanvasを使って、Polygon(多角形)を描画します。描画域は下側の描画キャンバスの四角内です。描画できる多角形は、三角形から十角形までと、十二角形と十六角形。角度は、0度から45度きざみで180度までと160度。カラーは、色の付いた四角をクリックして起動するカラーピッカーから選びます。また「クリア」ボタンをクリックすると、画面を初期化します。

でき上がった画像は、右クリックから名前を付けて保存できます。フォーマットは背面透過のpngになりますので、Photoshopなどのソフトで画像の選択が容易です。キャンバスの下の画像は、実際に作成した画像をPhotoshopで開いたサンプルです。webデザインのボタン作成などの補助に使えそうです。

 

描画キャンバス

辺の数:
 図形の角度:
 カラー:
 画面をクリア:

 

サンプル画像

サンプル画像
※引用と参考;https://codepen.io/andyranged/pen/YEYYww
戻るボタン