mirror of
https://github.com/Pomax/BezierInfo-2.git
synced 2025-08-22 16:23:12 +02:00
code comments
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
let curve;
|
||||
|
||||
setup() {
|
||||
// we're going to look at this as three different "views"
|
||||
setPanelCount(3);
|
||||
curve = Bezier.defaultCubic(this);
|
||||
setMovable(curve.points);
|
||||
@@ -10,20 +11,23 @@ setup() {
|
||||
draw() {
|
||||
clear();
|
||||
|
||||
// form our left and right curves, using the "de Casteljau" points
|
||||
let p = curve.get(this.position);
|
||||
const struts = this.struts = curve.getStrutPoints(this.position);
|
||||
const c1 = new Bezier(this, [struts[0], struts[4], struts[7], struts[9]]);
|
||||
const c2 = new Bezier(this, [struts[9], struts[8], struts[6], struts[3]]);
|
||||
|
||||
// first, draw the same thing we saw in the section on de Casteljau's algorithm
|
||||
this.drawBasics(p);
|
||||
|
||||
// then in the next panel, draw the subcurve to the "left" of point `t`
|
||||
nextPanel();
|
||||
setStroke(`black`);
|
||||
line(0, 0, 0, this.height);
|
||||
this.drawSegment(c1, p, `first`);
|
||||
|
||||
// and in the third panel, draw the subcurve to the "right" of point `t`
|
||||
nextPanel();
|
||||
|
||||
setStroke(`black`);
|
||||
line(0, 0, 0, this.height);
|
||||
this.drawSegment(c2, p, `second`);
|
||||
@@ -33,12 +37,14 @@ drawBasics(p) {
|
||||
curve.drawCurve(`lightgrey`);
|
||||
curve.drawSkeleton(`lightgrey`);
|
||||
curve.drawPoints(false);
|
||||
|
||||
noFill();
|
||||
setStroke(`red`);
|
||||
circle(p.x, p.y, 3);
|
||||
|
||||
setStroke(`lightblue`);
|
||||
curve.drawStruts(this.struts);
|
||||
|
||||
setFill(`black`)
|
||||
text(`The full curve, with struts`, 10, 15);
|
||||
}
|
||||
@@ -47,12 +53,15 @@ drawSegment(c, p, halfLabel) {
|
||||
setStroke(`lightblue`);
|
||||
curve.drawCurve(`lightblue`);
|
||||
curve.drawSkeleton(`lightblue`);
|
||||
|
||||
c.drawCurve();
|
||||
c.drawSkeleton(`black`);
|
||||
c.points.forEach(p => circle(p.x, p.y, 3));
|
||||
|
||||
noFill();
|
||||
setStroke(`red`);
|
||||
circle(p.x, p.y, 3);
|
||||
|
||||
setFill(`black`)
|
||||
text(`The ${halfLabel} half`, 10, 15);
|
||||
}
|
||||
|
Reference in New Issue
Block a user