Processing 基礎 (三) 陣列&燈光

Processing 基礎 (三)  陣列&燈光

          Processing 是視覺繪圖軟體,陣列&燈光是視覺化少不了的，陣列能產生一的連續的表面，燈光可強調立體感。是用 Processing3.11 範例修改。

範例 一 陣列

float[][] distances;  //設定變數
float maxDistance;
int spacer;

void setup() {
  size(640, 640);
  maxDistance = dist(width/2, height/2, width, height);
  distances = new float[width][height];
  for (int y = 0; y < height; y++) {
    for (int x = 0; x < width; x++) {
      float distance = dist(width/2, height/2, x, y);
      distances[x][y] = distance/maxDistance * 255;
    }
  }
  spacer = 10;      
  strokeWeight(7);      //筆畫大小=7
  noLoop();            //只執行一次
}

void draw() {
  background(0);
  for (int y = 0; y < height; y += spacer) {
    for (int x = 0; x < width; x += spacer) {
      stroke(distances[x][y],x,y);       //設定畫筆顏色
      point(x + spacer/2, y + spacer/2); //畫點
    }
  }
}

範例二 燈光

void setup() {          //設定環境
  size(640, 480, P3D);  //畫面大小 604 X 480 啟用3D
  noStroke();          //物體無邊框
  fill(#EA217F);       //填入顏色 #EA217F
}

void draw() {    //開始畫圖
  noStroke();    //無邊框
  background(0);   //背景黑色
  float dirY = (mouseY / float(height) - 0.5) * 2;    //設定變數dirY
  float dirX = (mouseX / float(width) - 0.5) * 2;     //設定變數dirX
  directionalLight(204, 204, 204, -dirX, -dirY, -1);  //設定燈光來源
  translate(width/2 - 100, height/2, 0);      //把座標0,0 設在螢幕寬/2 -100 螢幕高/2
  sphere(80);                 //畫一個半徑80的空心球
  translate(200, 0, 0);       //把坐標0,0右移200
  sphere(80);               //把坐標0,0右移200
}

sphere()

sphere() 空心的圓球，這圓球是很多三角形組合成的。

語法 :

sphere(半徑)

directionalLight()

      directionalLight()平行光源,directionalLight(v1, v2, v3, nx, ny, nz)須設定平行光源的顏色與來源，v1, v2,v3 可以是RGB或HSB,nx,ny燈源方向，例如 y = -1 表示燈源從底部往上照。

語法 :

directionalLight(v1, v2, v3, nx, ny, nz)

point()

      point()繪製一個點，第一個參數是該點的水平值，第二值是該點的垂直值，可選的第三值是深度值。

語法 :

point(x, y)
point(x, y, z)


參考資料 : https://processing.org/