get equal distance points on bezier

Programming Questions

clankill3r

get equal distance points on bezier

in Programming Questions • 1 year ago

with bezierPoint the distance between the points is not equal.

Is there a way to get equal distance points?

void setup() {
size(600, 600);
noFill();
bezier(255, 60, 30, 30, 0, 0, 45, 240);
fill(255);
int steps = 10;
for (int i = 0; i <= steps; i++) {
float t = i / float(steps);
float x = bezierPoint(255, 30, 0, 45, t);
float y = bezierPoint(60, 30, 0, 240, t);
ellipse(x, y, 5, 5);
}
}

Replies(4)

kooogy

Re: get equal distance points on bezier

1 year ago

there's no easy way. if i was after, say, 10 divisions, i would do something quick and dirty like work out 100 or so points on the curve calculate their distances from one end and then choose a subset of these points that are roughly equally spaced (using the total distance). this would be an approximation, but it's probably good enough.

kooogy

Re: get equal distance points on bezier

1 year ago

btw, the technical term for this, iirc, is 'arc length parameterization'.

(i did this in my degree course CG module c1988)

clankill3r

Re: get equal distance points on bezier

1 year ago

thanks,

this looks like a interesting article:

http://www.planetclegg.com/projects/WarpingTextToSplines.html

maybe i will even read it :)

clankill3r

Re: get equal distance points on bezier

1 year ago

didn't read yet but here's what i came up with:

void setup() {
size(200, 200);
smooth();
noFill();
bezier(85, 20, 10, 10, 90, 90, 15, 80);
fill(255);
int steps = 10;
for (int i = 0; i <= steps; i++) {
float t = i / float(steps);
float x = bezierPoint(85, 10, 90, 15, t);
float y = bezierPoint(20, 10, 90, 80, t);
ellipse(x, y, 5, 5);
}
fill(255, 0, 0);
for (int i = 0; i <= steps; i++) {
float t = i / float(steps);
PVector bp = bezierParameterizationPoint(85, 20, 10, 10, 90, 90, 15, 80, t);
ellipse(bp.x, bp.y, 3, 3);
}
}
// . . . . . . . . . . . . . . . . . . .
PVector bezierParameterizationPoint(float x1, float y1, float cx1, float cy1, float cx2, float cy2, float x2, float y2, float t) {
if(t == 0) {
return new PVector(x1, y1);
}
else if(t == 1) {
return new PVector(x2, y2);
}
PVector returnVector = new PVector();
float targetL = t * bezierLength(x1, y1, cx1, cy1, cx2, cy2, x2, y2, 100);
float l = 0;
int steps = 100;
for (int i = 0; i < steps; i++) {
float t1 = i / float(steps);
float t2 = (i+1) / float(steps);
float xPos1 = bezierPoint(x1, cx1, cx2, x2, t1);
float xPos2 = bezierPoint(x1, cx1, cx2, x2, t2);
float yPos1 = bezierPoint(y1, cy1, cy2, y2, t1);
float yPos2 = bezierPoint(y1, cy1, cy2, y2, t2);
l += dist(xPos1, yPos1, xPos2, yPos2);
if (targetL - l < 0) { // smaller then tolerance?
returnVector.x = xPos2;
returnVector.y = yPos2;
break;
}
}
return returnVector;
}
// . . . . . . . . . . . . . . . . . . .
float bezierLength(float x1, float y1, float cx1, float cy1, float cx2, float cy2, float x2, float y2, int steps) {
float l = 0;
for (int i = 0; i < steps; i++) {
float t = i / float(steps);
float t2 = (i+1) / float(steps);
float xPos1 = bezierPoint(x1, cx1, cx2, x2, t);
float xPos2 = bezierPoint(x1, cx1, cx2, x2, t2);
float yPos1 = bezierPoint(y1, cy1, cy2, y2, t);
float yPos2 = bezierPoint(y1, cy1, cy2, y2, t2);
l += dist(xPos1, yPos1, xPos2, yPos2);
}
return l;
}

Top Reply