p5.js にはタートルグラフィックスを行う関数はないので、「turtle.js」を用意した。 ・turtle.js move と turn を実現するためには，描画の現在位置（LP）と現在角を内部的に記憶しておかなけれ...

方向と長さを与えて直線を引いていく形式のグラフィックスをタートル・グラフィックスという。タートル・グラフィックスはLOGOや UCSD Pascalで有名になったもので、△形のカーソルをタートル（亀）にみたて、この亀に方...

「数学って、社会で何の役に立つの？」そんな声をよく耳にします。でも、実は高校で習う三角関数は、社会の様々な場面で活躍しています。 tan関数 たとえば、測量の世界ではその力が発揮されます。ある木の高さを直接測れないときで...

y=xやy=x2などの関数グラフを描く。 ■setpoint関数とmoveto関数を作る line 関数は始点と終点を与えて直線を描くが、関数グラフなどの連続した線を描く場合は、描画現 在位置(LPX,LPY)から(x,...

数学座標からp5.jsの座標に座標変換する方法を考える。 数学座標は画面の中央が原点（0,0）でｙ軸の正の向きは上方向である。一方p5.jsの座標は画面の左上隅が原点(0,0)でｙ軸の正の向きは下方向である。 p5.js...

マスのクリックでドットアートを作る。 例題2-10-1 描16×16のマスをクリックするたびに□と■の表示を交互に行う。画色を指定できるようにする。 コード 結果 練習問題2-10-1 各自ドットアートを描きなさい。

文字にこだわらず様々なグラフィックス図形を描く。 例題2-9-1 描画色を指定できるようにする。 コード 結果 練習問題2-9-1 各自グラフィックスアートを描きなさい。

今まではf,x,yという３つの配列にデータを格納していたが、これをまとめて１つの配列にする。 ストの要素に辞書を使うことで１つにまとめることができる。個々の要素はA[i].f,A[i].x,A[i].yのように取得できる...

「A」、「山」などの一筆書きできない文字を描く。 「A」は「Λ」と「－」の２つの直線群で考える。このように一筆書きできない場合は終点フラグを導入する。一筆書きできる直線群の最後の点のフラグを「1」とし、ここから次の直線群...

「N」、「M」などの一筆書きできる英字を描く。 左上隅を（0,0）とし、100×100のサイズの中で各点のx,y座標をとる。データは配列x,yに格納する。 例題2-6-1 Nを描く。 コード 結果 練習問題2-6-1 以...