How to draw a curve?

[Richard JE Cooke]

I can draw shapes and lines with no problem, but can't see how to draw curves.

This code shows nothing on the screen:

p.project.currentStyle.strokeWidth = 10;

p.project.currentStyle.strokeColor = 'red';

new p.Curve(new p.Point(100,10), new p.Point(50,40), new p.Point(150,70), new p.Point(100,100));

//even adding this does nothing:    new p.Path(c);

What am I doing wrong please?

[Richard JE Cooke]

I figured out you can't use curves, you have to use something called a segment, which I don't understand, but that's ok.

But this code draws the black line show below, when I expect it to draw the red line:

    const c = new p.Curve(new p.Point(100,10), new p.Point(50,40), new p.Point(150,70), new p.Point(100,100));

    const path = new p.Path(c.segment1, c.segment2);

since my first curve influence point is left of the start I expect the to start off moving left. Why does it not please?

[Richard JE Cooke]

Right!  After much experimenting with curve handles and playing in Inkscape I see that the handle positions are RELATIVE, not absolute: https://medium.com/@bragg/cubic-bezier-curves-with-svg-paths-a326bb09616f

This is not mentioned anywhere in the paper.js reference or tutorials. How do I obtain the documentation please?

[Richard JE Cooke]

*update the documentation*

[asensi...@gmail.com]

A bit late but you indeed found the cause of the issue.

The fact that handles coordinates are relative to the point are actually mentioned in the Segment documentation.

But maybe this could be precised in one of the tutorials.