# Help wanted using complicated math drawing (spline)

I tried writing some code that allows the user to add points to an array, then draws a dotted line which is curved.
Meaning this is happens:

I tried figuring this out myself, but it didnt end well. The only thing i have is a dotted line function:

``````ArrayList<PVector> points = new ArrayList<PVector>();

void setup() {
size(540, 540);

}

void draw() {
background(255);
pointLine(points, 5);
}

void pointLine(ArrayList<PVector> points, int spacing) {
for (int i = 0; i < points.size() - 1; i++) {
float distance = points.get(i).dist(points.get(i+1));
float step = spacing / distance;

for (float t = 0; t < 1; t += step) {
PVector interpolated = PVector.lerp(points.get(i), points.get(i+1), t);
fill(#FF0000, 25);
noStroke();
circle(interpolated.x, interpolated.y, 25);
}
}
}
``````

I can’t seem to get the smoothing to work, i mean that basically it draws a dotted bezier curve for all points in the array. You might ask why? to draw easily tails with images (its something like someone might use in a drawing programm)!

I will be thankfull for any help! Hi @nuhuhwy,

The Catmull-Rom spline algorithm is your friend.
Google for it… Cheers
— mnse

1 Like

Try curveVertex (continuous spline curve). Reference is here: [Curves / Processing.org] (Curves / Processing.org) if you haven’t already seen it. Be sure to use first and last points as anchors.

1 Like