We closed this forum 18 June 2010. It has served us well since 2005 as the ALPHA forum did before it from 2002 to 2005. New discussions are ongoing at the new URL http://forum.processing.org. You'll need to sign up and get a new user account. We're sorry about that inconvenience, but we think it's better in the long run. The content on this forum will remain online.
IndexProgramming Questions & HelpSyntax Questions › bezier curve with 3 points
Page Index Toggle Pages: 1
bezier curve with 3 points (Read 2346 times)
bezier curve with 3 points
Sep 1st, 2009, 1:59am
 
hi,
i want to make a bezier curve with 3 points (2 corner, 1 middle), can only find samples with 2 corner points.
in what order come the anchor and control values?
(X anchor point1, Y anchor point1, X control anch.1, y control anch.1,
and then?
thanks!
Re: bezier curve with 3 points
Reply #1 - Sep 1st, 2009, 2:53am
 
i believe its done by adding more and more segments to beziervertext
http://processing.org/reference/bezierVertex_.html
Re: bezier curve with 3 points
Reply #2 - Sep 1st, 2009, 2:57am
 
Usually, you make two Bézier curves joining seamlessly on the middle point.
Not sure about your second question. Can't say more than what is explained at bezier() and bezierVertex().
Personally, when I have to chain several Bézier curves, I use the latter. I even made a couple of helper functions, visualizing the anchors/control points, it is great to debug hand-made figures.
I shown them at Re: Why theese bezierVertex don´t make an egg.
Re: bezier curve with 3 points
Reply #3 - Sep 1st, 2009, 3:21am
 
ok, thank you! ..i thought it might be possible, as in most standard vector software, to draw a single line just with several points...
Re: bezier curve with 3 points
Reply #4 - Sep 1st, 2009, 3:45am
 
ok, i'll try to make a heart like this:
beginShape();
bezier(0,0, -25,-90,-150,-70,-150,25);
bezier(-150,25,-150,120,-50,126,0,250);
endShape();

but the fills don't connect...Sad

unfortunately the bezier helper file doesn't show up anything
Re: bezier curve with 3 points
Reply #5 - Sep 1st, 2009, 9:14am
 
holger wrote on Sep 1st, 2009, 3:21am:
in most standard vector software, to draw a single line just with several points...
I can only guess, but I strongly suspect they just hide the fact there are several Bézier lines by treating them as a whole. But in general, you can click in the middle of a complex curve, on a node, and decide there will be a sharp angle there (tangents are no longer aligned) or even separate them.

Quote:
unfortunately the bezier helper file doesn't show up anything
It doesn't do magic. If you look at the code, you will see I used my helper functions (of same names, but with an initial capital, per my old habit) instead of Processing's ones (which are used internally, of course). Beside, as I said above (in a clumsy way), I use bezierVertex() instead of bezier(), as it is easier to chain them.

I drew a heart (which I animated) as one of my first Processing sketches, not sure if I ever shown it in this forum.
The heart (sic...) of the sketch is:
Code:
    beginShape();
// The heart, symmetrical around vertical axis
// Anchor point (highest sharp point)
vertex(m_x, m_y);
// Top left part
bezierVertex(
m_x, m_y - m_topVectorLen, // Upward control vector
m_x - m_size, m_y - m_topVectorLen, // Idem
m_x - m_size, m_y);
// Bottom left part
bezierVertex(
m_x - m_size, m_y + m_topVectorLen, // Downward control vector
m_x - m_bottomVector_dx, m_y + m_bottomLen - m_bottomVector_dy,
m_x, m_y + m_bottomLen);
// Bottom right part
bezierVertex(
m_x + m_bottomVector_dx, m_y + m_bottomLen - m_bottomVector_dy,
m_x + m_size, m_y + m_topVectorLen, // Downward control vector
m_x + m_size, m_y);
// Top right part
bezierVertex(
m_x + m_size, m_y - m_topVectorLen, // Upward control vector
m_x, m_y - m_topVectorLen, // Idem
m_x, m_y);

endShape();

As you can see, I heavily parametrized it to allow easy customizations. The tangents here are either horizontal or vertical, so aligning them was quite easy.
Re: bezier curve with 3 points
Reply #6 - Sep 2nd, 2009, 2:08am
 
hi PhiLho, thank you so much! ...wow that looks really complex, i'll try to get a heart out of it today. yesterday i made a simple one with only two bezierepoint lines on each side, looks quite good, but i want another point to have a more pointy end of the heart at the botom. i guess yours will do it.
oh man, thats sometimes really not very comfortable for an graphic artist coming from convenient interfaces, when i ask someone for a light its mostly that he starts explaining how to mix sulfur and phosphorus with a helpful wiki link;)

i can not believe that something, where one draws some bezier lines with a pen tool and it generates the code right away, doesn't exist?
Re: bezier curve with 3 points
Reply #7 - Sep 2nd, 2009, 7:12am
 
You can export your drawing (in Illustrator, in Inkscape...) in SVG, Processing should be able to load and display it.
Re: bezier curve with 3 points
Reply #8 - Sep 9th, 2009, 2:11am
 
yes thanks, i did that. but i want further acces to the code for manipulating it generatively...
Re: bezier curve with 3 points
Reply #9 - Sep 9th, 2009, 9:41am
 
You might be interested by the Bézier Editor tool recently released.
Re: bezier curve with 3 points
Reply #10 - Sep 17th, 2009, 2:08am
 
WWOOWW! this is my dream! thank you so much!Smiley:)
Page Index Toggle Pages: 1