Scribd
Upload
10 views10 pages

Laporan Grafika

1. The document discusses Bezier curves and their parametrization. It defines a BezierCurve class to generate points along a curve based on standard and arc length parametrization. 2. The draw function displays the curve with both types of parametrization and allows interacting with the t parameter value using the mouse or animation. 3. Additional elements include labels, a seek bar to adjust t, and different drawing styles for the various elements.

Uploaded by

Candra Dwi Setia Budi
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
10 views10 pages

Laporan Grafika

1. The document discusses Bezier curves and their parametrization. It defines a BezierCurve class to generate points along a curve based on standard and arc length parametrization. 2. The draw function displays the curve with both types of parametrization and allows interacting with the t parameter value using the mouse or animation. 3. Additional elements include labels, a seek bar to adjust t, and different drawing styles for the various elements.

Uploaded by

Candra Dwi Setia Budi
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 10

1.

Array

a. Array Hasil
b. Array_Object

Hasil
c. Array_2D

Hasil
2. Tugas II

a. Move_Eye

Hasil
b. Pie_Chart

Hasil
c. Saturation

Hasil
3. Tugas III

a. Animasi_2D

Hasil
b. Curve
class BezierCurve {
PVector startPoint;
PVector controlPoint1;
PVector controlPoint2;
PVector endPoint;

BezierCurve(PVector startPoint, PVector controlPoint1, PVector controlPoint2, PVector


endPoint) {
this.startPoint = startPoint;
this.controlPoint1 = controlPoint1;
this.controlPoint2 = controlPoint2;
this.endPoint = endPoint;
}

PVector pointAtParameter(float t) {
float u = 1 - t;
float tt = t * t;
float uu = u * u;
float uuu = uu * u;
float ttt = tt * t;

PVector point = PVector.mult(startPoint, uuu);


point.add(PVector.mult(controlPoint1, 3 * uu * t));
point.add(PVector.mult(controlPoint2, 3 * u * tt));
point.add(PVector.mult(endPoint, ttt));
return point;
}

PVector pointAtFraction(float fraction) {


float arcLength = arcLength();
float t = map(fraction, 0, 1, 0, arcLength);
return pointAtParameter(t);
}

float arcLength() {
float totalLength = 0;
PVector previousPoint = startPoint;
int resolution = 100;
for (int i = 1; i <= resolution; i++) {
float t = i / (float)resolution;
PVector currentPoint = pointAtParameter(t);
float segmentLength = PVector.dist(previousPoint, currentPoint);
totalLength += segmentLength;
previousPoint = currentPoint;
}
return totalLength;
}
PVector[] points(int count) {
PVector[] points = new PVector[count];
for (int i = 0; i < count; i++) {
float t = i / (float)(count - 1);
points[i] = pointAtParameter(t);
}
return points;
}
PVector[] equidistantPoints(int count) {
PVector[] points = new PVector[count];
float arcLength = arcLength();
float stepSize = arcLength / (float)(count - 1);
float accumulatedLength = 0;
PVector previousPoint = startPoint;
points[0] = previousPoint;
for (int i = 1; i < count; i++) {
float targetLength = i * stepSize;
float t = 0;
while (accumulatedLength < targetLength) {
t += 0.001;
PVector currentPoint = pointAtParameter(t);
float segmentLength = PVector.dist(previousPoint, currentPoint);
accumulatedLength += segmentLength;
previousPoint = currentPoint;
}
points[i] = previousPoint;
}
return points;
}
}

BezierCurve curve;

PVector[] points;
PVector[] equidistantPoints;

float t = 0.0;
float tStep = 0.004;

final int POINT_COUNT = 80;


int borderSize = 40;
void setup() {
size(640, 360, P2D);
frameRate(60);
smooth(8);
textAlign(CENTER);
textSize(16);
strokeWeight(2);

PVector a = new PVector( 0, 300);


PVector b = new PVector( 440, 0);
PVector c = new PVector(-200, 0);
PVector d = new PVector( 240, 300);

curve = new BezierCurve(a, b, c, d);


points = curve.points(POINT_COUNT);
equidistantPoints = curve.equidistantPoints(POINT_COUNT);
}

void draw() {
// Show static value when mouse is pressed, animate otherwise
if (mousePressed) {
int a = constrain(mouseX, borderSize, width - borderSize);
t = map(a, borderSize, width - borderSize, 0.0, 1.0);
} else {
t += tStep;
if (t > 1.0) t = 0.0;
}

background(255);
pushMatrix();
translate(borderSize, -50);

labelStyle();
text("STANDARD\nPARAMETRIZATION", 120, 310);
curveStyle();
beginShape(LINES);
for (int i = 0; i < points.length - 1; i += 2) {
vertex(points[i].x, points[i].y);
vertex(points[i+1].x, points[i+1].y);
}
endShape();

circleStyle();
PVector pos1 = curve.pointAtParameter(t);
ellipse(pos1.x, pos1.y, 12, 12);

popMatrix();
pushMatrix();
translate(width/2 + borderSize, -50);

labelStyle();
text("ARC LENGTH\nPARAMETRIZATION", 120, 310);
curveStyle();
beginShape(LINES);
for (int i = 0; i < equidistantPoints.length - 1; i += 2) {
vertex(equidistantPoints[i].x, equidistantPoints[i].y);
vertex(equidistantPoints[i+1].x, equidistantPoints[i+1].y);
endShape();

circleStyle();
PVector pos2 = curve.pointAtFraction(t);
ellipse(pos2.x, pos2.y, 12, 12);

popMatrix();

// draw seek bar


pushMatrix();
translate(borderSize, height - 45);

int barLength = width - 2 * borderSize;

barBgStyle();
line(0, 0, barLength, 0);
line(barLength, -5, barLength, 5);

barStyle();
line(0, -5, 0, 5);
line(0, 0, t * barLength, 0);

barLabelStyle();
text(nf(t, 0, 2), barLength/2, 25);
popMatrix();
}

// Styles -----

void curveStyle() {
stroke(170);
noFill();
}

void labelStyle() {
noStroke();
fill(120);
}

void circleStyle() {
noStroke();
fill(0);
}

void barBgStyle() {
stroke (220);
noFill();
}

void barStyle() {
stroke(50);
noFill();
}

void barLabelStyle() {
noStroke();
fill(120);
}

You might also like