info/BezierInfo-2
1
0
Fork 0
mirror of https://github.com/Pomax/BezierInfo-2.git synced 2025-08-31 20:11:59 +02:00
Code Issues Releases Wiki Activity

figured out how to reuse sketches with data-attribute parameters

Browse Source
This commit is contained in:
Pomax
2020-08-26 21:56:58 -07:00
parent bf88ba4e4c eb997e6455
commit 94a98120ae
93 changed files with 5805 additions and 24390 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
docs/chapters/yforx/yforx.js
View File

@@ -1,13 +1,14 @@
let curve;
setup() {
this.curve = new Bezier(this, 20, 250, 30, 20, 200, 250, 220, 20);
setMovable(this.curve.points);
curve = new Bezier(this, 20, 250, 30, 20, 200, 250, 220, 20);
setMovable(curve.points);
setSlider(`.slide-control`, `position`, 0.5);
}
draw() {
resetTransform();
clear();
const curve = this.curve;
curve.drawSkeleton();
curve.drawCurve();
@@ -19,14 +20,14 @@ draw() {
// prepare our values for root finding:
let x = round(bbox.x.min + (bbox.x.max - bbox.x.min) * this.position);
let xcoords = this.curve.points.map((p,i) => ({x:i/3, y: p.x - x}));
let xcoords = curve.points.map((p,i) => ({x:i/3, y: p.x - x}));
// find our root:
let roots = Bezier.getUtils().roots(xcoords);
let t = this.position===0 ? 0 : this.position===1 ? 1 : roots[0];
// find our answer:
let y = round(this.curve.get(t).y);
let y = round(curve.get(t).y);
setStroke("red");
line(x, y, x, h);
@@ -37,9 +38,3 @@ draw() {
text(`x=${x}`, x + 5, h - (h-y)/2);
text(`t=${((t*100)|0)/100}`, x + 15, y);
}
onMouseMove() {
if (this.cursor.down) {
redraw();
}
}