Processing中利用平視和餘數做Motion Graphics

利用ortho平視，讓簡單的三維造型有特殊的視覺呈現

用取餘數做計數器，到時間按照指定軸向旋轉

完整代碼，詳見文章最末

boolean roll;nPVector degree;nint rollType;nPVector trgDegree;nPVector viceDegree;nvoid setup() {n size(800, 800, P3D);n degree = new PVector(-35.0, -45.0, 90.0);n trgDegree = new PVector(-35.0, -45.0, 90.0);n viceDegree = new PVector(-35.0, -45.0, 90.0);n rollType = 5;n smooth(8);n frameRate(60);n}nnvoid draw() {n background(255);n ortho();n noLights();n noFill();n strokeWeight(3.0);n stroke(255);n pushMatrix();n translate(width/2.0, height/2.0, 0.0);n rotateX(radians(-35.0));n rotateY(radians(-45.0));n rotateZ(radians(-90.0));n boxMatrix(80.0, 40.0);n popMatrix();nn //noFill();n stroke(0, 200);n pushMatrix();n translate(width/2.0, height/2.0, 0.0);n rotateX(radians(degree.x));n rotateY(radians(degree.y));n rotateZ(radians(degree.z));n if (frameCount%200==0) {n roll = true;n rollType++;nn if (rollType%3==0) {n trgDegree = degree.copy().add(new PVector(0.0, 0.0, 90.0));n }n if (rollType%3==1) {n trgDegree = degree.copy().add(new PVector(0.0, 90.0, 0.0));n }n if (rollType%3==2) {n trgDegree = viceDegree.copy();n }n }nn if (roll) {n degree.lerp(trgDegree, 0.03);n if (degree.dist(trgDegree)<0.1) {n degree = trgDegree.copy();n roll = false;n }n }n boxMatrix(120.0, 40.0);n popMatrix();n}nnvoid boxMatrix( n float mtrSz, n float boxSize) {n beginShape();n for (float i = -mtrSz; i<mtrSz+1.0; i=i+boxSize) {n for (float j = -mtrSz; j<mtrSz+1.0; j=j+boxSize) {n for (float k = -mtrSz; k<mtrSz+1.0; k=k+boxSize) {n pushMatrix();n translate(i, j, k);n if (i>-mtrSz) {n line(0, 0, 0, n -boxSize, 0, 0);n }n if (j>-mtrSz) {n line(0, 0, 0, n 0, -boxSize, 0);n }n if (k>-mtrSz) {n line(0, 0, 0, n 0, 0, -boxSize);n }n popMatrix();n }n }n }n endShape();n}n

推薦閱讀：