円形ゲージを描画 📖

円形ゲージを描画します。

プログラム: (→大)
# V ：ゲージで表す割合 (0 以上 1 以下) # XY：ゲージの中心座標を表す配列 [x, y] # R ：ゲージの半径 # 「塗色設定」を反映する。 # 「線色設定」は無視し、常にフチは無しとする。 ●(VでXYにRの)円形ゲージ描画とは キャンバス状態保存。 「#00000000」に線色設定。 XYに描画起点設定。 [R, R]に描画拡大。 Vの0から1までのCLAMPして2×PIを掛ける。 定数のゲージ角度はそれ。 定数の座標配列は[[0, -3], [0, 0], [1.5×SIN(ゲージ角度), -1.5×COS(ゲージ角度)]]。 もし、Vが0.5超ならば 座標配列に[-3, 0]を配列追加。 座標配列に[0, 3]を配列追加。 ここまで。 座標配列に[3, 0]を配列追加。 キャンバス状態保存。 「#00000000」に塗色設定。 座標配列の多角形描画。 キャンバス状態復元。 描画クリップ。 [0, 0]に1の円描画。 キャンバス状態復元。 ここまで。 もし、プラグイン名が「メイン」ならば # 撫子色 https://www.colordic.org/colorsample/2023 「#eebbcb」に塗色設定。 [0,1,0]の値指定バー作成。 それの「step」に「any」をDOM属性設定。 それの「input」がDOMイベント発火した時には 全描画クリア。 対象のテキスト取得して実数変換。 それで[150, 150]に100の円形ゲージ描画。 ここまで。 ここまで。