基礎コンピュータグラフィックス論

CGプログラミング論
平成27年5月20日
森田 彦
基礎課題4-1
<コンピュータ上の座標>
(0,0)
x軸
グラフのy座標
50
y軸
y0
線分3
50
(x0+100,y0-50)
void DrawGraphics(Graphics g) {
50
線分1
int x0,y0,lx,ly;
x0
lx=200; //x軸の長さ
(x0,y0)
100
ly=180; //y軸の長さ
x0=10; //グラフの原点のx座標
y0=200; //グラフの原点のy座標
g.setColor(Color.black); //軸の描画色を黒色に指定
g.drawLine(x0,y0,x0+lx,y0); //x軸の描画
g.drawLine(x0,y0,x0,y0-ly); //y軸の描画
g.setColor(Color.blue); //グラフの描画色を青色に指定
g.drawLine(x0,y0,x0+100, y0-50 ) ; //線分1の描画
}
y0-150
②150
y0-
線分2
グラフのx座標
50
25
y0 ①100
g.drawLine(x0+100,y0-50,x0+150, y0-100
); //線分2の描画
g.drawLine(x0+150,y0-100,x0+175,
); //線分3の描画
<コンピュータ上の座標
>
(0,0)
基礎課題4-2
50
y
軸
x
軸
グラ フのy 座
標
線 分
3
y
0
50
void DrawGraphics(Graphics g) {
(x +100,y -50) 線 分
2
int x0,y0,lx,ly,x1,y1,x2,y2;
50
線 分
1
lx=200; //x軸の長さ
x0
(x0,y0)
100
50
・・・
g.setColor(Color.blue); //グラフの描画色を青色に指定
//グラフの描画
int wx=100; //x軸方向の移動幅の設定
x1=0; //最初の始点のx座標の設定
y1=0; //最初の始点のy座標の設定
for(int i=1;i<=3;i++) {
x2=x1+wx; //終点のx座標の設定
y1+50
y2= y1+50
; //終点のy座標の設定
①
g.drawLine(x0+x1,y0-y1,x0+x2,y0-y2);
x1=x2; //次の始点のx座標の設定
y1=y2; //次の始点のy座標の設定
wx=wx/2; //次のx軸方向の移動幅の設定
}
}
0
0
グラ フのx 座
標
25
基礎課題4-3
y=x2 (0≦x≦10)
・・・
//グラフの描画
int wx=1;
x1=0;
y1=0;
i<=10
①
for(int i=1; i<=10
;i++) {
x2=i*wx;
y2=x2*x2;
g.drawLine(x0+20*x1,y0-2*y1,x0+20*x2,y0-2*y2);
x1=x2;
y1=y2;
}
・・・
基礎課題4-4
void DrawGraphics(Graphics g) {
int x0,y0,lx,ly;
double x1,y1,x2,y2; //一般的には座標値は実数型で表す
lx=200; //x軸の長さ
・・・
//グラフの描画
double wx=0.1; //x軸方向の刻み幅も一般には実数型変数で表す。
x1=0;
2 (0≦x≦1)
y1=0;
y=x
i<=10
①
for(int i=1; i<=10
;i++) {
x2=i*wx;
y2=x2*x2;
g.drawLine( x0+(int)(100*x1),y0-(int)(100*y1),
x0+(int)(100*x2),y0-(int)(100*y2) );
x1=x2;
y1=y2;
}
}
(0,0)
応用課題4-A
(
コ
ン
ピ
ュ
ー
タ
上
の
)
y
軸
(コンピュータ上の)x軸
(10,10)
x軸
(x0,y0)
y軸
void DrawGraphics(Graphics g) {
int x0,y0,lx,ly;
lx
double x1,y1,x2,y2;
lx=200; //x軸の長さ
ly=200; //y軸の長さ
x0=10+lx/2; //グラフの原点のx座標
y0=10+ly/2; //グラフの原点のy座標
g.setColor(Color.black); //軸の描画色を黒色に指定
10+lx
①
g.drawLine(10,y0, 10+lx
,y0);
//x軸の描画
g.drawLine(x0,10,x0, 10+ly
10+ly
); //y軸の描画
②
g.setColor(Color.blue); //グラフの描画色を青色に指定
//グラフの描画
ly
応用課題4-A
(その2)
y=x3 (-3≦x≦3)
//グラフの描画
double wx=0.1;
int Cx=20,Cy=3;
-3
③
x1= -3
;
y1=x1*x1*x1;
for(int i=1;i<=60;i++) {
x2=i*wx-3;
y2=x2*x2*x2;
g.drawLine( x0+(int)(Cx*x1),y0-(int)(Cy*y1),
x0+(int)(Cx*x2),y0-(int)(Cy*y2) );
x1=x2;
y1=y2;
}
応用課題4-B
y=sin(x) (-3.14≦x≦3.14)
・・・
//グラフの描画
int Cx=30,Cy=60;
int Num=100;
double wx=3.14*2/Num;
x1=-3.14;
①
y1= Math.sin(x1)
Math.sin(x1)
;
for(int i=1;i<=Num;i++) {
x2=i*wx-3.14;
②
y2= Math.sin(x2)
Math.sin(x2)
;
g.drawLine( x0+(int)(Cx*x1),y0-(int)(Cy*y1),
x0+(int)(Cx*x2),y0-(int)(Cy*y2));
x1=x2;
y1=y2;
}
本日の学習内容 円の描画
5-1 三角関数の初歩
半径rの円周上の点P(x,y)
P(x,y)
r
θ
x=r×cosθ
xx
y=r×sinθ
cosθ=x/r,
sinθ=y/r
三角関数の定義
y
y
基礎課題5-1
30°
2
3
60°
45°
1
45°
1
1
cos(60°)=1/2
cos(30°)=
2
3②/ 2
cos(45°)= 1 / ④ 2
sin(60°)=
3①/ 2
③
sin(30°)= 1/2
sin(45°)= 1 / 2
基礎課題5-1
θ(ラジアン)=(θ(角度)/180)×π
45° →
60° →
⑤
π/4
⑥
π/3
(ラジアン)
(ラジアン)
本日の学習内容 円の描画

提出課題
【基礎課題5-1】~【基礎課題5-5】および【応
用課題5-A】の6題です。
演習課題の受け取りについて

原則として講義時間内に提出してもらいます。提出
が遅れた場合は以下のように減点とします。
基礎課題 応用課題
講義時間内
終了後1時間以内
100%
90%
100%
100%
1時間超~当日中
70%
100%
翌日の17:00まで
0%
100%
それ以上の遅れ
0%
0%
課題内容によっては、上の基準を緩和します。その際は講義
時にアナウンスします。