▶ 実 行
▶ 実行
クリア
円グラディエーション = NULL 足揺れ = 0 揺れ向き = 1 揺れ幅 = 5 足モード = 「停止」 向き = -90 FID = 0 準備 0でメインループ ●足モードチェンジ 足モードで条件分岐 「停止」ならば、足モードは「移動」。ここまで。 「移動」ならば、足モードは「回転」。ここまで。 「回転」ならば、足モードは「停止」。ここまで。 ここまで ここまで ●準備 CTX = 描画中コンテキスト # 甲羅用の緑のグラディエーション 円グラディエーション = CTXの"createRadialGradient"を[32,32,0,32,32,24]でJSメソッド実行 円グラディエーションの"addColorStop"を[0.0,"rgb(240,255,240)"]でJSメソッド実行 円グラディエーションの"addColorStop"を[0.3,"rgb(224,255,224)"]でJSメソッド実行 円グラディエーションの"addColorStop"を[1.0,"rgb(80,255,80)"]でJSメソッド実行 描画中キャンバスの「click」に「足モードチェンジ」をDOMイベント追加 「キャンバスをクリックすると足の動きが変わるよ」を表示 ここまで ●後始末 描画中キャンバスの「click」から「足モードチェンジ」をDOMイベント削除 FIDを画面更新処理取消 ここまで ●(TIMESTAMPで)メインループ 足前後 全描画クリア 向きに足揺でマイカメ描画 FID = 「メインループ」を画面更新時実行 ここまで ●足前後 足揺れ = 足揺れ + 揺れ向き もし、ABS(足揺れ) ≧ 揺れ幅ならば、 揺れ向き = - 揺れ向き ここまで ここまで ●(Dに揺れで)マイカメ描画 F = 0 B = 0 足モードで条件分岐 「回転」ならば、F = 揺れ。ここまで。 「移動」ならば、B = 揺れ。ここまで。 ここまで キャンバス状態保存 # 頭と足の描画の準備 "rgb(144,144,64)"に線色設定 "rgb(208,192,80)"に塗色設定 １に線太さ設定 # 頭描画 X = COS(DEG2RAD(D))*23+32 Y = SIN(DEG2RAD(D))*23+32 [X,Y]へ8の円描画 # 足描画 DEGで[50+F,130-F,230-F,310+F]を反復する X = COS(DEG2RAD(D+DEG))*24+32 Y = SIN(DEG2RAD(D+DEG))*24+32+B [X,Y]へ5の円描画 B = -B ここまで # 甲羅描画の準備 円グラディエーションに塗色設定 "rgb(16,160,16)"に線色設定 ２に線太さ設定 # 甲羅描画 [32,32]へ24の円描画 キャンバス状態復元 ここまで