タートルグラフィクス(Promise版)のサンプルその３　複数カメでカメ視点 📖

タートルグラフィクス(Promise版)のサンプルに、カメを中心に据えた画像を同時に表示。２つのカメで同期して描き始めて、途中でもう１度同期してカメ増やして続きを描く。

プログラム: (→大)
# タートルグラフィクス(Promise版)を取り込む !「https://n3s.nadesi.com/plain/792.js」を取り込む 一時キャンバス = 「canvas_temp」のDOM要素取得 もし、一時キャンバス=NULLならば、 　一時キャンバス = 「CANVAS」のDOM要素作成 　一時キャンバス["id"] = 「canvas_temp」 　描画中キャンバス["parentNode"]に一時キャンバスをDOM子要素追加 ここまで 一時キャンバス["width"] = 描画中キャンバス["width"] 一時キャンバス["height"] = 描画中キャンバス["height"] カメ描画先 = 一時キャンバス 主観描画処理 ●主観描画処理 　「主観描画処理」を画面更新時実行 　全描画クリア 　もし、カメ数取得＝0ならば、戻る。 　W = 描画中キャンバス["width"] 　H = 描画中キャンバス["height"] 　表示エリアリスト４ = [ 　　{left: 0, width: W/2,top: 0,height: H/2} 　　{left: W/2, width: W/2,top: 0,height: H/2} 　　{left: 0, width: W/2,top: H/2,height: H/2} 　　{left: W/2, width: W/2,top: H/2,height: H/2} 　] 　表示エリアリスト２ = [ 　　{left: 0, width: W/2,top: 0,height: H} 　　{left: W/2, width: W/2,top: 0,height: H} 　] 　もし、カメ数取得≦２ならば、 　　表示エリアリスト = 表示エリアリスト２ 　違えば、 　　表示エリアリスト = 表示エリアリスト４ 　ここまで 　TID = 0 　表示エリアリストを反復する 　　表示エリア = それ 　　もし、TID≧カメ数取得ならば、 　　　続ける 　　ここまで 　　XY = TIDからカメ位置取得 　　D = ((TIDからカメ角度取得)+90) % 360 　　キャンバス状態保存 　　黒色に線色設定 　　空に塗色設定 　　1に線太さ設定 　　[表示エリア["left"],表示エリア["top"],表示エリア["width"],表示エリア["height"]]に四角描画 　　描画中コンテキストの"beginPath"を[]でJSメソッド実行 　　描画中コンテキストの"rect"を[表示エリア["left"],表示エリア["top"],表示エリア["width"],表示エリア["height"]]でJSメソッド実行 　　描画中コンテキストの"clip"を[]でJSメソッド実行 　　キャンバス状態保存 　　[表示エリア["left"]+表示エリア["width"]/2, 表示エリア["top"]+表示エリア["height"]/2]に描画起点設定 　　 (360-D)に描画回転 　　一時キャンバスを[-XY[0],-XY[1]]に画像描画 　　キャンバス状態復元 　　黒色に線色設定 　　黒色に塗色設定 　　1に線太さ設定 　　[表示エリア["left"]+表示エリア["width"]/2,表示エリア["top"]+表示エリア["height"]/2]へ3の円描画 　　キャンバス状態復元 　　TID = TID + 1 　ここまで ここまで 同期カウンタ = 0 カメ全消去 T0 = カメ作成 赤色にカメペン色設定 オフにカメペン設定 150だけカメ進む (90+60)だけカメ右回転 オンにカメペン設定の成功時には 　２で同期チェック後には 　　魔法円描画共通A 　ここまで ここまで T1 = カメ作成 青色にカメペン色設定 オフにカメペン設定 -150だけカメ進む (30)だけカメ左回転 オンにカメペン設定の成功時には 　２で同期チェック後には 　　魔法円描画共通A 　ここまで ここまで ●(CALLBACKをNで)同期チェック後 　同期カウンタ = 同期カウンタ + 1 　もし、同期カウンタ＜Nならば、戻る。 　同期カウンタ = 0 　CALLBACK() ここまで ●魔法円描画共通A 　２回繰り返す 　　TID = 回数-1 　　TIDにカメ操作対象設定 　　２回繰り返す 　　　150*SQRT(3)だけカメ進む 　　　120だけカメ右回転 　　ここまで 　　150*SQRT(3)だけカメ進む 　　60だけカメ右回転 　　黒色にカメペン色設定 　　180回繰り返す 　　　1だけカメ右回転 　　　(150*PI/180)だけカメ進む 　　ここまで 　　オフにカメペン設定 　　90だけカメ左回転 　　10だけカメ進む 　　90だけカメ左回転 　　オンにカメペン設定 　　黒色にカメペン色設定 　　30回繰り返す 　　　1だけカメ左回転 　　　(160*PI/180)だけカメ進む 　　ここまで 　　オンにカメペン設定の成功時には 　　　２で同期チェック後には 　　　　魔法円描画共通B 　　　ここまで 　　ここまで 　ここまで ここまで ●魔法円描画共通B 　２回繰り返す 　　TID = 回数-1 　　TIDからカメ複製 　　オフにカメペン設定 　　90だけカメ左回転 　　110だけカメ進む 　　90だけカメ左回転 　　オンにカメペン設定 　　180回繰り返す 　　　1だけカメ右回転 　　　(48*PI/180)だけカメ進む 　　ここまで 　　カメ非表示 　　TIDにカメ操作対象設定 　　150回繰り返す 　　　1だけカメ左回転 　　　(160*PI/180)だけカメ進む 　　ここまで 　　カメ非表示 　ここまで ここまで