Processing講座 第一回
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
単語検索
|
最終更新
|
ヘルプ
]
開始行:
*Processing講座 第一回 [#f3db52e9]
**環境構築 [#w7c511cc]
1. ダウンロード
-- https://processing.org/にアクセス~
-- downLoad Processingをクリック~
-- 自分のPCのOSにあったものを選ぶ~
2. 解凍する
-- zipファイルを好きな場所に解凍しよう~
3. 実行する
-- 「Processing.exe」アイコンをダブルクリック~
~
これで、Processingが起動します~
~
#ref(http://monge.tec.fukuoka-u.ac.jp/cg_processing/image...
**何か描いてみよう！ [#sb782b69]
次のように入力して左上のRunボタンをクリック~
line(0,0,200,200);
これで、左上から右下に直線が描かれます。~
カッコ内の数値は直線の始点座標と終点座標を表しており、(始...
**様々な図形 [#w06c6b5d]
Processingでは様々な図形を描くことができます。~
以下に基本的な図形の命令を書いておきます。
|図形|宣言方法|
|点|point(x,y)|
|直線|line(x1,y1,x2,y2)|
|長方形|rect(x,y,幅,高さ)|
|楕円|ellipse(x,y,横直径,縦直径)|
|三角形|triangle(x1,y1,x2,y2,x3,y3)|
**座標の指定方法 [#r86bfe0d]
Processingで図形や絵を描くとき、その位置を座標で指示しま...
横軸をx軸、縦軸をy軸と呼び、画面の左上が原点となります。~
直交座標上の、とある点の座標は、原点からx軸上の位置aと、...
#ref(http://www.catch.jp/wiki/index.php?plugin=attach&ref...
しかし、Processingでは一般的な座標指定と違い、上の図のよ...
また、描画エリアのサイズは、size命令で自由に設定すること...
size(x,y);
**色を指定する [#m29f5708]
Processingでは、0～255の数値で色を指定します。~
|種類|例|
|グレースケール|(255)|
|グレースケール,透明度|(255,30)|
|RGB|(255,0,0)|
|RGB、透明度|(255,0,0,30)|
|RGB：16進表示|(#FF0000)|
|RGB、透明度：16進表示|(#FF0000, 30)|
例えば、背景色を変えたい場合
background(255);
これで、背景色を白色で塗りつぶすことができます。
**図形の装飾 [#v8d420e1]
|意味|宣言方法|
|線の太さ|strokeWeight(太さ)|
|線の色|stroke(R,G,B)|
|線なし|noStroke()|
|塗りつぶし|fill(R,G,B)|
|塗りつぶしなし|noFill()|
終了行:
*Processing講座 第一回 [#f3db52e9]
**環境構築 [#w7c511cc]
1. ダウンロード
-- https://processing.org/にアクセス~
-- downLoad Processingをクリック~
-- 自分のPCのOSにあったものを選ぶ~
2. 解凍する
-- zipファイルを好きな場所に解凍しよう~
3. 実行する
-- 「Processing.exe」アイコンをダブルクリック~
~
これで、Processingが起動します~
~
#ref(http://monge.tec.fukuoka-u.ac.jp/cg_processing/image...
**何か描いてみよう！ [#sb782b69]
次のように入力して左上のRunボタンをクリック~
line(0,0,200,200);
これで、左上から右下に直線が描かれます。~
カッコ内の数値は直線の始点座標と終点座標を表しており、(始...
**様々な図形 [#w06c6b5d]
Processingでは様々な図形を描くことができます。~
以下に基本的な図形の命令を書いておきます。
|図形|宣言方法|
|点|point(x,y)|
|直線|line(x1,y1,x2,y2)|
|長方形|rect(x,y,幅,高さ)|
|楕円|ellipse(x,y,横直径,縦直径)|
|三角形|triangle(x1,y1,x2,y2,x3,y3)|
**座標の指定方法 [#r86bfe0d]
Processingで図形や絵を描くとき、その位置を座標で指示しま...
横軸をx軸、縦軸をy軸と呼び、画面の左上が原点となります。~
直交座標上の、とある点の座標は、原点からx軸上の位置aと、...
#ref(http://www.catch.jp/wiki/index.php?plugin=attach&ref...
しかし、Processingでは一般的な座標指定と違い、上の図のよ...
また、描画エリアのサイズは、size命令で自由に設定すること...
size(x,y);
**色を指定する [#m29f5708]
Processingでは、0～255の数値で色を指定します。~
|種類|例|
|グレースケール|(255)|
|グレースケール,透明度|(255,30)|
|RGB|(255,0,0)|
|RGB、透明度|(255,0,0,30)|
|RGB：16進表示|(#FF0000)|
|RGB、透明度：16進表示|(#FF0000, 30)|
例えば、背景色を変えたい場合
background(255);
これで、背景色を白色で塗りつぶすことができます。
**図形の装飾 [#v8d420e1]
|意味|宣言方法|
|線の太さ|strokeWeight(太さ)|
|線の色|stroke(R,G,B)|
|線なし|noStroke()|
|塗りつぶし|fill(R,G,B)|
|塗りつぶしなし|noFill()|
ページ名:
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
