プログラミング 【p5.js】迷路の最短経路を出力する
スタートからゴールまでの距離を2次元配列で表現して、最短経路の通路を「 」(半角スペース)から「*」に置き換えて出力する。 let maze1; function setup() { maze1 = new Maze(15, 15); ma...
p5.js
プログラミング プログラミング 【p5.js】迷路のスタートとゴールを設定する
迷路のスタートとゴールを座標によって設定し、スタートを「S」、ゴールを「G」として出力する。 let maze1; function setup() { maze1 = new Maze(15, 15); maze1.set_maze_bo...
プログラミング 【p5.js】棒倒し法で迷路を生成する
迷路の幅と高さをそれぞれ width, height として設定し、その数値にしたがって棒倒し法で迷路を生成する。※迷路の幅と高さは5以上の奇数とする。 let maze1; function setup() { maze1 = new M...
プログラミング 【p5.js】スケッチを画像としてダウンロードする
canvas要素をtoDataURL()メソッドで画像データに変換し、aタグのリンク先のURLに指定することで画像ファイルとしてダウンロードできるようにする。そして、bodyタグの最後の行に以下の1行を追加する。 <script src="...
プログラミング 【p5.js】スケッチをWebページの背景に設定する
style()メソッドでcanvas要素の z-index を -1 に設定する。 index.html <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <tit...
プログラミング 【p5.js】p5.jsをCDNから読み込む
headタグの中に以下の2行を追加する。 <script src=""></script> <script src="sketch.js"></script> index.html <!DOCTYPE html> <html lang="j...