描画と計算
コンソールへの表示
print は、引数の値をコンソールに出力する関数です。
関数や引数についての詳細は基礎プログラミング2で扱います。
以下のプログラムを実行して動作を確認してみましょう。
print("Hello, ");
print("World!");
実行結果は以下のようになります。
Hello, World!
println は print と同じように引数の値をコンソールに出力する関数ですが、最後に改行を加えます。
以下のプログラムを実行して動作を確認してみましょう。
println("Hello, ");
println("World!");
実行結果は以下のようになります。
Hello,
World!
以下のふりがな表を使って、上のプログラムの読み下し文を作ります。 [プレースホルダー] のように[]付きの斜体で表記されている部分は、表記の実際の文字列を置き換えて読んでください。
| 表記 | ふりがな |
|---|---|
| println( [表示内容] ) | [表示内容] を表示しろ |
| print( [表示内容] ) | [表示内容] を改行なしで表示しろ |
| " [XXX] " | 文字列「 [XXX] 」 |
読み下し文はそれぞれ以下のようになります。
文字列「Hello, 」を改行なしで表示しろ
文字列「World!」を改行なしで表示しろ
文字列「Hello, 」を表示しろ
文字列「World!」を表示しろ
計算
Processingでは、算術演算子を使った加減乗除の計算ができます。 ふりがな表を覚えながら進みましょう。
整数値と実数値
Processingでは、整数値と実数値を区別します。 数値が小数点を含む場合は実数、含まない場合は整数になります。
| 表記 | ふりがな |
|---|---|
| [123] | 整数 [123] |
| [45.6] | 実数 [45.6] |
四則演算の演算子
四則演算の演算子は以下のふりがな表の通りです。
| 表記 | ふりがな |
|---|---|
| [左辺] + [右辺] | [左辺]に [右辺]を足した結果 |
| [左辺] - [右辺] | [左辺]から [右辺]を引いた結果 |
| [左辺] * [右辺] | [左辺]に [右辺]を掛けた結果 |
| [左辺] / [右辺] | [左辺]を [右辺]で割った結果 |
| [左辺] % [右辺] | [左辺]を [右辺]で割った余り |
| - [値] | [値] の正負を逆転させた結果 |
演算子の優先順位
演算子には優先順位が決まっています。 通常の算数と同じように乗算と除算は、加算と減算より優先されます。 ()を使うことで、()内を先に計算することができます。
優先順位が同じ場合は、左から順番に処理を行います。
例
以下のプログラムの読み下し文を書き、実行結果を予測してみましょう。
println(123);
println(-(45.6));
println(1 + 2 + 3);
println(1 + 2 * 3 / 4 % 5);
println((1.1 + 2.2) * 3.3 / 4.4 % 5.5);
上のプログラムの読み下し文は以下のようになります。
整数 123 を表示しろ
実数 45.6 の正負を逆転させた結果を表示しろ
整数1 に 整数2 を足した結果 に 整数3を足した結果 を表示しろ
整数1 に 整数2 に 整数3 を掛けた結果 を 整数4 で割った結果 を
整数5 で割った余り を足した結果 を表示しろ
実数1.1 に 実数2.2 を足した結果 に 実数3.3 を掛けた結果 を
実数4.4 で割った結果 を 実数5.5で割った余り を表示しろ
冗長に感じるかもしれませんが、コンピュータはプログラムをこのように解釈して処理を実行しています。 プログラミングの上達には、コンピュータの気持ちになってプログラムを読む能力が必要です。
読み下し文が長くなり、わかりにくければ （）でくくっても構いません。
( ( 整数1 に 整数2 を足した結果 ) に 整数3を足した結果 ) を表示しろ
( 整数1 に ( ( ( 整数2 に 整数3 を掛けた結果 ) を 整数4 で割った結果 ) を
整数5 で割った余り ) を足した結果 ) を表示しろ
( ( ( ( 実数1.1 に 実数2.2 を足した結果 ) に 実数3.3 を掛けた結果 ) を
実数4.4 で割った結果 ) を 実数5.5で割った余り ) を表示しろ
実行結果は以下のようになります。 予測と合っていましたか？
123
-45.6
6
2
2.4750001
数学関数
Processingでは、四則演算に加えて以下のような数学関数が計算に利用できます。 ふりがなと合わせて覚えておきましょう。
| 表記 | ふりがな |
|---|---|
| abs( [x] ) | [x] の絶対値 |
| ceil( [x] ) | [x] の小数を切り上げた値 |
| floor( [x] ) | [x] の小数を切り捨てた値 |
| sqrt( [x] ) | [x] の平方根 |
| exp( [x] ) | e（自然対数の底）の [x] 乗の値 |
| pow( [x] , [y] ) | [x] の [y] 乗の値 |
| log( [x] ) | log( [x] )の値 |
| dist( [x1] , [y1] , [x2] , [y2] ) | 点( [x1] , [y1] )と点( [x2] , [y2] )の距離 |
| sin( [x] ) | sin( [x] )の値 |
| cos( [x] ) | cos( [x] )の値 |
| tan( [x] ) | tan( [x] )の値 |
| asin( [x] ) | asin( [x] )の値 |
| acos( [x] ) | acos( [x] )の値 |
| atan( [x] ) | atan( [x] )の値 |
| degrees( [x] ) | [x] ラジアンを度に変換した結果 |
| radians( [x] ) | [x] 度をラジアンに変換した結果 |
三角関数はラジアンを引数として受け取ることに注意しましょう。
円周率
図形描画のための計算をするときには円周率を頻繁に使用します。 Processingでは、円周率に関する以下の定数を利用できます。
| 表記 | ふりがな |
|---|---|
| PI | 円周率 |
| HALF_PI | 円周率の半分の値 |
| QUARTER_PI | 円周率の1 / 4の値 |
| TWO_PI | 円周率の2倍の値 |
授業内課題02-1
以下のプログラムについて、(1) 読み下し文を書き、(2) 実行結果を予測せよ。 プログラムを実行し予測と合っていたか確かめよ。
println(pow(2, 8));
println(dist(1, 1, 4, 5));
println(sqrt(3 * 3 + 4 * 4));
println(sin(radians(30)));
授業内課題02-2
以下をそれぞれ計算し、コンソールに出力するプログラムを作成せよ。
- 底辺5、高さ7の三角形の面積
- 半径12.5の円の円周の長さ
- 半径10、中心角60°の扇型の面積
- 底面が一辺5の正方形、高さ5の四角錐の体積
描画
次に、Processingを用いた図形の描画について学びます。
描画関数
主な図形描画関数は以下の通りです。
| 表記 | ふりがな |
|---|---|
| rect( [x] , [y] , [w] , [h] ) | 左上の座標を( [x] , [y] )とした幅 [w] 、高さ [h] の長方形を描画しろ |
| ellipse( [cx] , [cy] , [w] , [h] ) | 中心の座標を( [cx] , [cy] )とした幅 [w] 、高さ [h] の楕円を描画しろ |
| triangle( [x1] , [y1] , [x2] , [y2] , [x3] , [y3] ) | 点( [x1] , [y1] )、点( [x2] , [y2] )、点( [x3] , [y3] )を頂点とした三角形を描画しろ |
| line( [x1] , [y1] , [x2] , [y2] ) | 点( [x1] , [y1] )と点( [x2] , [y2] )を結ぶ線分を描画しろ |
| point( [x1] , [y1] ) | 点( [x1] , [y1] )に点を描画しろ |
描画の設定のために以下の関数を利用します。
| 表記 | ふりがな |
|---|---|
| size( [w] , [h] ) | 画面の幅を [w] に、高さを [h] に設定しろ |
| background( [v1] , [v2] , [v3] ) | 背景色を( [v1] , [v2] , [v3] )に設定しろ |
| fill( [v1] , [v2] , [v3] ) | 塗り潰し色を( [v1] , [v2], [v3] )に設定しろ |
| stroke( [v1] , [v2] , [v3] ) | 線の色を( [v1] , [v2], [v3] )に設定しろ |
| noFill() | 塗り潰しをなしに設定しろ |
| noStroke() | 線をなしに設定しろ |
例
以下のプログラムの読み下し文を書き、実行結果を予測してみましょう。
size(400, 400);
background(0, 0, 0);
fill(255, 255, 0);
rect(50, 50, 100, 100);
fill(255, 0, 255);
ellipse(300, 300, 100, 100);
fill(0, 255, 255);
triangle(250, 50, 250, 150, 350, 150);
上のプログラムの読み下し文は以下のようになります。
画面の幅を 整数400 に、高さを 整数400 に設定しろ
背景色を( 整数0, 整数0, 整数0 )に設定しろ
塗り潰し色を( 整数255, 整数255, 整数0 )に設定しろ
左上の座標を( 整数50 , 整数50 )とした幅 整数100、高さ 整数100 の長方形を描画しろ
塗り潰し色を( 整数255, 整数0, 整数255 )に設定しろ
中心の座標を( 整数300 , 整数300 )とした幅 整数100 、高さ 整数100 の楕円を描画しろ
塗り潰し色を( 整数0, 整数255, 整数255 )に設定しろ
点( 整数250 , 整数50 )、点( 整数250 , 整数150 )、点( 整数350 , 整数150 )を
頂点とした三角形を描画しろ
実行結果は以下のようになります。
描画の順序
プログラムは上から順番に実行されるのが原則です。 そのため、描画した図形が重なる場合、新しい（後に実行された）図形が手前に描画され、古い（前に実行された）図形は奥に描画されて上書きされます。
以下のプログラムを実行して確認しましょう。
size(300, 400);
ellipse(100, 100, 200, 200);
ellipse(200, 100, 200, 200);
ellipse(200, 300, 200, 200);
ellipse(100, 300, 200, 200);
授業内課題02-3
以下のプログラムについて、(1) 読み下し文を書き、(2) 実行結果を予測せよ。 プログラムを実行し予測と合っていたか確かめよ。
size(400, 400);
ellipse(200, 200, 400, 400);
rect(200 - 200 / sqrt(2), 200 - 200 / sqrt(2), 400 / sqrt(2), 400 / sqrt(2));
ellipse(200, 200, 400 / sqrt(2), 400 / sqrt(2));
授業内課題02-4
幅400、高さ400のWindowにおいて、中心の座標を( 200 , 200 )とした半径 100 , 150, 200 の同心円を描画するプログラムを作成せよ。
変数
ここまでは、具体的な数字をプログラム中に書いて計算や描画を行ってきました。 例えば、授業内課題02-4のプログラムで同心円の中心座標を(300, 300)に変更しなければいけない場合、プログラム中の6箇所を変更しなければいけません。 同心円の数が増えると修正箇所が増えますし、より複雑なプログラムでは、様々な箇所での修正が必要となります。
ここでは、同心円の中心座標を変数に置くことで、少ない修正でプログラム全体の動作を変更することができます。
size(400, 400);
float cx = 300;
float cy = 300;
ellipse(cx, cy, 400, 400);
ellipse(cx, cy, 300, 300);
ellipse(cx, cy, 200, 200);
変数の宣言
変数を使用するためには、まず宣言が必要です。
| 表記 | ふりがな |
|---|---|
| int [変数名] ; | 整数型の変数 [変数名] を作成しろ |
| float [変数名] ; | 実数型の変数 [変数名] を作成しろ |
| String [変数名] ; | 文字列型の変数 [変数名] を作成しろ |
変数への代入
代入によって変数に値を入れることができます。
| 表記 | ふりがな |
|---|---|
| [変数] = [右辺] | 変数 [変数] に [右辺] を代入しろ |
| [変数] += [右辺] | 変数 [変数] の値に [右辺] を足した結果を変数 [変数] に代入しろ |
| [変数] -= [右辺] | 変数 [変数] の値から [右辺] を引いた結果を変数 [変数] に代入しろ |
| [変数] *= [右辺] | 変数 [変数] の値に [右辺] を掛けた結果を変数 [変数] に代入しろ |
| [変数] /= [右辺] | 変数 [変数] の値を [右辺] で割った結果を変数 [変数] に代入しろ |
| [変数] ++ | 変数 [変数] の値を1増やせ |
| [変数] -- | 変数 [変数] の値を1減らせ |
変数の参照
式中で変数の値を参照することができます。
| 表記 | ふりがな |
|---|---|
| [変数名] | 変数 [変数名] の値 |
変数の初期化
変数の初期化構文によって変数の宣言と代入を同時に行うことができます。
| 表記 | ふりがな |
|---|---|
| int [変数名] = [右辺]; | 整数型の変数 [変数名] を作成して、 [右辺] で初期化しろ |
| float [変数名] = [右辺]; | 実数型の変数 [変数名] を作成して、 [右辺] で初期化しろ |
| String [変数名] = [右辺]; | 文字列型の変数 [変数名] を作成して、 [右辺] で初期化しろ |
システム変数
Processingのシステムが提供する、読み取りのみ可能な特殊な変数をシステム変数と呼びます。 現在のWindowの幅や高さがシステム変数として定義されています。
| 表記 | ふりがな |
|---|---|
| width | Windowの幅 |
| height | Windowの高さ |
例
変数を用いて、同心円を描くプログラムを再掲します。
size(400, 400);
float cx = 300;
float cy = 300;
ellipse(cx, cy, 400, 400);
ellipse(cx, cy, 300, 300);
ellipse(cx, cy, 200, 200);
これを読み下し文で書くと以下のようになります。
画面の幅を 整数400 に、高さを 整数400 に設定しろ
実数型の変数 cx を作成して、 整数300 で初期化しろ
実数型の変数 cy を作成して、 整数300 で初期化しろ
中心の座標を( 変数cxの値 , 変数cyの値 )とした幅 整数400 、高さ 整数400 の楕円を描画しろ
中心の座標を( 変数cxの値 , 変数cyの値 )とした幅 整数300 、高さ 整数300 の楕円を描画しろ
中心の座標を( 変数cxの値 , 変数cyの値 )とした幅 整数200 、高さ 整数200 の楕円を描画しろ
授業内課題02-5
以下のプログラムについて、(1) 読み下し文を書き、(2) 実行結果を予測せよ。 プログラムを実行し予測と合っていたか確かめよ。
size(400, 400);
background(0, 0, 0);
fill(0, 0, 0);
stroke(255, 255, 0);
float cx = width / 2;
float cy = height / 2;
float r = width / 2;
ellipse(cx, cy, 2 * r, 2 * r);
float theta = 270;
float dTheta = 360 / 5 * 2;
float x1, y1, x2, y2;
x1 = cx + r * cos(radians(theta));
y1 = cy + r * sin(radians(theta));
x2 = cx + r * cos(radians(theta + dTheta));
y2 = cy + r * sin(radians(theta + dTheta));
line(x1, y1, x2, y2);
theta += dTheta;
x1 = cx + r * cos(radians(theta));
y1 = cy + r * sin(radians(theta));
x2 = cx + r * cos(radians(theta + dTheta));
y2 = cy + r * sin(radians(theta + dTheta));
line(x1, y1, x2, y2);
theta += dTheta;
x1 = cx + r * cos(radians(theta));
y1 = cy + r * sin(radians(theta));
x2 = cx + r * cos(radians(theta + dTheta));
y2 = cy + r * sin(radians(theta + dTheta));
line(x1, y1, x2, y2);
theta += dTheta;
x1 = cx + r * cos(radians(theta));
y1 = cy + r * sin(radians(theta));
x2 = cx + r * cos(radians(theta + dTheta));
y2 = cy + r * sin(radians(theta + dTheta));
line(x1, y1, x2, y2);
theta += dTheta;
x1 = cx + r * cos(radians(theta));
y1 = cy + r * sin(radians(theta));
x2 = cx + r * cos(radians(theta + dTheta));
y2 = cy + r * sin(radians(theta + dTheta));
line(x1, y1, x2, y2);
授業内課題02-6
下図のような図形を描画するプログラムを作成せよ。 WIndowの幅と高さを変更した際に、他の箇所の修正が必要なく図形が伸び縮みするようにせよ。
幅300、高さ300での描画結果
幅600、高さ300での描画結果
まとめ
今回は、演算と描画、変数について学びました。 式や変数の概念はプログラミングの基本の一つとなるのでしっかり身につけましょう。
また、本講義で扱う関数はほぼ全て今回の中で紹介しています。 ふりがなとともに、どのような効果を持つか覚えておきましょう。
解答例
授業内課題02-1
読み下し文
整数2 の 整数8 乗の値 を表示しろ
点(整数1, 整数1)と点(整数4, 整数5)の距離 を表示しろ
整数3 に 整数3を掛けた結果 に 整数4 に 整数4 を掛けた結果 を足した結果 の平方根 を表示しろ
sin( 整数30 度をラジアンに変換した結果 )の値 を表示しろ
実行結果
256.0
5.0
5.0
0.5
授業内課題02-2
解答例
println("底辺5、高さ7の三角形の面積: ");
println(5.0 * 7.0 / 2.0);
println("半径12.5の円の円周の長さ: ");
println(12.5 * 2 * PI);
println("半径10、中心角60°の扇型の面積: ");
println(10 * 10 * PI / 6);
println("底面が一辺5の正方形、高さ5の四角錐の体積: ");
println(5.0 * 5.0 * 5.0 / 3.0);
実行結果
底辺5、高さ7の三角形の面積: 17.5
半径12.5の円の円周の長さ: 78.53982
半径10、中心角60°の扇型の面積: 52.35988
底面が一辺5の正方形、高さ5の四角錐の体積: 41.666668
ポイント
- 整数の除算では、余りは切り捨てられることに注意しよう。
- 出力が何を表しているか、文字列による説明も加えておくと丁寧です。
授業内課題02-3
読み下し文
画面の幅を 整数400 に、高さを 整数400 に設定しろ
中心の座標を( 整数200 , 整数200 )とした幅 整数400 、高さ 整数400 の楕円を描画しろ
左上の座標を( 整数200 から 整数200 を 整数2 の平方根で割った結果 を引いた結果 ,
整数200 から 整数200 を 整数2 の平方根で割った結果 を引いた結果 )とした
幅 整数400 を 整数2 の平方根 で割った結果 、
高さ 整数400 を 整数2 の平方根 で割った結果 の長方形を描画しろ
中心の座標を( 整数200 , 整数200 )とした幅 整数400 を 整数2 の平方根 で割った結果、
高さ 整数400 を 整数2 の平方根 で割った結果 の楕円を描画しろ
実行結果
ステップアップ
- どうして円に内接する正方形、正方形に内接する円になるのか考えてみよう
授業内課題02-4
解答例
size(400, 400);
ellipse(200, 200, 400, 400);
ellipse(200, 200, 300, 300);
ellipse(200, 200, 200, 200);
ポイント
- 描画の順番に気をつけましょう。大きいものは先に、小さいものは後に描画します。
- 半径と直径を間違えないようにしましょう。
授業内課題02-5
読み下し文
画面の幅を 整数400 に、高さを 整数400 に設定しろ
背景色を( 整数0 , 整数0 , 整数0 )に設定しろ
塗り潰し色を( 整数0 , 整数0 , 整数0 )に設定しろ
線の色を (整数255, 整数255, 整数0) に設定しろ
実数型の変数 cx を作成して、 Windowの幅 を 整数2 で割った結果 で初期化しろ
実数型の変数 cy を作成して、 Windowの高さ を 整数2 で割った結果 で初期化しろ
実数型の変数 r を作成して、Windowの幅 を 整数2 で割った結果 で初期化しろ
中心の座標を( 変数 cx の値 , 変数 cy の値 )とした幅 整数2 に 変数rの値を掛けた結果 、
高さ 整数2 に 変数r の値を掛けた結果 の楕円を描画しろ
実数型の変数 theta を作成して、整数270 で初期化しろ
実数型の変数 dTheta を作成して、整数360 を 整数5 で割った結果 に 整数2 を掛けた結果 で初期化しろ
実数型の変数x1 , y1 , x2 , y2を作成しろ
変数 x1 に変数cx に 変数r に cos( 変数 theta の値 度をラジアンに変換した結果 ) を
掛けた値 を足した結果 を代入しろ
変数 y1 に変数cx に 変数r に sin( 変数 theta の値 度をラジアンに変換した結果 ) を
掛けた値 を足した結果 を代入しろ
変数 x2 に変数cx に 変数r に cos( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
変数 y2 に変数cx に 変数r に sin( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
点( 変数 x1 の値 , 変数 y1 の値 )と点( 変数 x2 の値 , 変数 y2 の値 )を結ぶ線分を描画しろ
変数 theta の値に 変数 dTheta の値 を足した結果を 変数 theta に代入しろ
変数 x1 に変数cx に 変数r に cos( 変数 theta の値 度をラジアンに変換した結果 )
を掛けた値 を足した結果 を代入しろ
変数 y1 に変数cx に 変数r に sin( 変数 theta の値 度をラジアンに変換した結果 )
を掛けた値 を足した結果 を代入しろ
変数 x2 に変数cx に 変数r に cos( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
変数 y2 に変数cx に 変数r に sin( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
点( 変数 x1 の値 , 変数 y1 の値 )と点( 変数 x2 の値 , 変数 y2 の値 )を結ぶ線分を描画しろ
変数 theta の値に 変数 dTheta の値 を足した結果を 変数 theta に代入しろ
変数 x1 に変数cx に 変数r に cos( 変数 theta の値 度をラジアンに変換した結果 )
を掛けた値 を足した結果 を代入しろ
変数 y1 に変数cx に 変数r に sin( 変数 theta の値 度をラジアンに変換した結果 )
を掛けた値 を足した結果 を代入しろ
変数 x2 に変数cx に 変数r に cos( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
変数 y2 に変数cx に 変数r に sin( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
点( 変数 x1 の値 , 変数 y1 の値 )と点( 変数 x2 の値 , 変数 y2 の値 )を結ぶ線分を描画しろ
変数 theta の値に 変数 dTheta の値 を足した結果を 変数 theta に代入しろ
変数 x1 に変数cx に 変数r に cos( 変数 theta の値 度をラジアンに変換した結果 )
を掛けた値 を足した結果 を代入しろ
変数 y1 に変数cx に 変数r に sin( 変数 theta の値 度をラジアンに変換した結果 )
を掛けた値 を足した結果 を代入しろ
変数 x2 に変数cx に 変数r に cos( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
変数 y2 に変数cx に 変数r に sin( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
点( 変数 x1 の値 , 変数 y1 の値 )と点( 変数 x2 の値 , 変数 y2 の値 )を結ぶ線分を描画しろ
変数 theta の値に 変数 dTheta の値 を足した結果を 変数 theta に代入しろ
変数 x1 に変数cx に 変数r に cos( 変数 theta の値 度をラジアンに変換した結果 )
を掛けた値 を足した結果 を代入しろ
変数 y1 に変数cx に 変数r に sin( 変数 theta の値 度をラジアンに変換した結果 )
を掛けた値 を足した結果 を代入しろ
変数 x2 に変数cx に 変数r に cos( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
変数 y2 に変数cx に 変数r に sin( 変数 theta の値 に 変数 dTheta の値を足した結果 度を
ラジアンに変換した結果 ) を掛けた値 を足した結果 を代入しろ
点( 変数 x1 の値 , 変数 y1 の値 )と点( 変数 x2 の値 , 変数 y2 の値 )を結ぶ線分を描画しろ
実行結果
授業内課題02-6
解答例
size(600, 300);
background(0, 0, 0);
int shapeWidth = width / 3;
int shapeHeight = height / 3;
rect(0, 0, shapeWidth, shapeHeight);
rect(width / 3 * 2, 0, shapeWidth, shapeHeight);
rect(width / 3, height / 3, shapeWidth, shapeHeight);
rect(0, height / 3 * 2, shapeWidth, shapeHeight);
rect(width / 3 * 2, height / 3 * 2, shapeWidth, shapeHeight);
ellipse(width / 2, height / 6, shapeWidth, shapeHeight);
ellipse(width / 2, height / 6 * 5, shapeWidth, shapeHeight);
ellipse(width / 6, height / 2, shapeWidth, shapeHeight);
ellipse(width / 6 * 5, height / 2, shapeWidth, shapeHeight);
授業外レポート
授業外課題02-1
寿司打（ http://neutral.x0.com/home/sushida/play2.html ）「5000円コース」をプレイし、以下のスコアを報告せよ（スピードは任意）
- 成績（xxx円分得 or 損した）
- 正しく打ったキーの数
- 平均キータイプ数（回 / 秒）
- ミスタイプ数
授業外課題02-2
以下のプログラムの読み下し文を書け。
println(1 + 2 - 3 * 4 - 5);
println(degrees(PI));
int x = 10 / 3 + 2 - 5 * 2;
x *= 10 + 2;
println(exp(x));
授業外課題02-3
以下のプログラムの読み下し文を書け。
size(400, 400);
background(0, 0, 0);
stroke(255, 255, 255);
line(0, 0, width, height);
fill(255, 0, 0);
ellipse(100, 100, 200, 200);
fill(0, 255, 0);
ellipse(300, 300, 200, 200);
fill(0, 0, 255);
rect(100, 100, 200, 200);
授業外課題02-4
以下をそれぞれ計算し、コンソールに出力するプログラムを作成せよ。
- 1から10までの整数を足した値
- sin( 225度 ) の絶対値
- 点(cos(20度), sin(20度))から点(cos(70度), sin(70度))の距離
- 底面が半径5の円、高さ5の円錐の体積
授業外課題02-5
幅400、高さ400の黒色のWindowにおいて、Windowに内接する白色の正円を描き、その円に内接する赤色の正三角形を描画せよ。 なお、Windowの幅と高さを変更した際に、他の箇所の変更なしに同様の図形が描画できること。 Windowの幅と高さは同じであると仮定してよい。
実行結果
