Curves!
NOTE: This thread includes several updates. Use the updated versions of make_curve, fit_curve, and make_curve.py in the demo attached to my July 10 2019 comment, not the one attached to this comment.
Until now there were only two ways to make curves in NodeBox: quad and arc. Both create curves with control points, but define those control points for you based on simple settings. It was not possible to make a curve with arbitrary control points.
That's why I made the make_curve custom node. Make_curve lets you set the starting point P1, the ending point P2, and two control points C1 and C2. Make_curve gives you total control.
Make_curve makes it possible to do things like modify curves from an imported SVG or morph one curve smoothly into another. Or you can sketch curves directly by scrubbing the control point X and Y values.
It can often be hard, though, to calculate control point values to achieve the effect you want. So I also provide a very handy subnetwork, fit_curve, based on an algorithm by Bernhard R. Fischer.
Fit_curve uses make_curve to create a smooth curve that passes through each point in a given path. You can make the curve open or closed and adjust its "curviness". It's like the connect node except that it builds curve segments instead of line segments. My recent "Curvy Characters" post shows some of the possibilities.
The attached demo network illustrates some possible uses of make_curve and fit_curve:
- Arbitrary Curve (center). A simple curve segment created directly from make_curve. The two red dots show the control points. Adjust values to see how it works.
- Smooth Polygon (upper left). By feeding a polygon into fit_curve you can round its corners a little or a lot to create a wide variety of beautiful shapes.
- Bell Curve (upper right). This example creates a histogram of a normal distribution by conducting 1000 trials of ten coin flips. Fit_curve allows you take any set of data points like this and connect them with a smooth curve.
- Arbitrary Shape (lower left). This organic looking shape would be hard to construct in NodeBox using ellipses, quads, or arcs. The tangent lines and control points show how the fit_curve algorithm works. Adjust curviness and see what happens!
- Spiral (lower right). Spirals were a pain to construct in NodeBox until now. Instead of using functions to calculate zillions of points and then stitching together approximations, you can just take a simple rectilinear spiral and curvify it! By adjusting the curviness you can easily create squarish spirals or elaborate spirograph designs. Great for making labyrinths, decaying orbits, or swirling text.
In addition to demonstrating possible curves, this network contains many useful subnetworks you can use in other projects:
- controls. Draws red control points for any curve.
- spiral. Draws a resizable rectilinear spiral with a given number of turns.
- make_table. Converts lists of values into a table with headers that can then be filtered, sorted, etc. This version makes two-column tables but is easy to modify.
- distribution. Given a data table, a key from that table, and a range of possible values, produces a distribution table.
- histogram. Snaps onto distribution to plot a very simple histogram.
Enjoy!
John
- Curves!.zip 8.86 KB
-
Curve_Samples.png
51.7 KB
Curve_Samples.png
Keyboard shortcuts
Generic
| ? | Show this help |
|---|---|
| ESC | Blurs the current field |
Comment Form
| r | Focus the comment reply box |
|---|---|
| ^ + ↩ | Submit the comment |
You can use Command ⌘ instead of Control ^ on Mac
1 Posted by gabriel sim-lar... on 03 Sep, 2017 10:01 AM
Incredible! I'm working on an illustration and this is exactly what I needed. Thank you so much
Support Staff 2 Posted by john on 03 Sep, 2017 08:00 PM
You just made my day.
If possible, I'd love to see what you eventually make with these tools.
John
Support Staff 3 Posted by john on 28 Oct, 2017 10:25 PM
NOTE: Attached is an updated version of my Curves demo. It contains an updated version of the fit_curves subnetwork.
For certain paths, if fit curve was set to "closed" it would not fill correctly when colorized. This version fixes this.
If you are using make _curve or fit_curves in any of your projects, you should replace it with the fit_curves subnetwork found inside this demo.
JULY 10, 2019 UPDATE: I have changed the port order for make_curve and released new versions of make_curve, fit_curve, and make_curve.py. See July 10, 2019 comment in this thread for an attachment with the latest versions.
Support Staff 4 Posted by Frederik De Ble... on 15 Nov, 2017 05:03 PM
This is another super-useful node to have in core! I'll see if I can port it to Java soon.
Support Staff 5 Posted by Frederik De Ble... on 15 Nov, 2017 05:10 PM
I've added this to GitHub to track its progress:
https://github.com/nodebox/nodebox/issues/437
Since there are basically two types of curves in NodeBox (quads and béziers) I was thinking how you would generalize this. Then I remembered that in Houdini, you can specify the order of the curve, which allows you to set the number of control points for the curve. 0 control points will give you a straight line, 1 a quad, 2 a bézier. And you can go higher!
http://www.sidefx.com/docs/houdini/nodes/sop/curve#parameters
Support Staff 6 Posted by john on 16 Nov, 2017 09:06 AM
Frederik,
I am excited you are looking at this.
If you wind up generalizing curves, you might also consider generalizing the connect node. My fit_curve subnetwork is the natural companion to my make_curve custom node - I almost always use the two together. Fit_curve works exactly like connect except with curves instead of line segments.
I notuce that Houdini also has a fit curve node, though theirs is more complex.
Just a thought...
John
Support Staff 7 Posted by john on 24 Mar, 2019 08:45 PM
Frederik,
The perfect should not be the enemy of the good. Given that all NodeBox curves are build out of cubic beziers - even quads are instantly turned into cubics under the hood - a basic cubic make curve node is all we really need.
I am working on a library of NodeBox nodes. I try to avoid using custom nodes (Python code) unless absolutely necessary. I am finding that I end up using make_curve in many of these nodes.
If you could release a new version of NodeBox with a simple make_curve node, as you said you wanted to do back in November of 2017, would be a solid step forward.
(FYI - the other custom node I am forced to use from time to time is contours, a very simple node you wrote which just turns a path into separate contours. I think that is also worthy of promotion to a full-fledged node, though the need for make_curve is more urgent.)
Support Staff 8 Posted by john on 10 Jul, 2019 09:47 PM
UPDATE
I just made a minor revision to my make_curve node. Same functionality; all I did was change the order of the ports. NEW VERSION ATTACHED.
As I learn more about bezier curves I notice that the rest of the world always lists the four points of a bezier curve in P1 C1 C2 P2 order (with the control points in the middle and the end point last). It was confusing having my ports in a different order, so I changed my order to match.
This did require a change to the python code as well. Going forward I will be using this new node which requires the revised make_curve.py file. This is what I will be using in my soon to be released node library.
The new version is in the attached zip file. The demo also includes an updated version of fit_curve. I recommend using these new versions of make_curve and fit_curve (with the new make_curve.py) in any new projects you make.
Frederick, if you're still out there somewhere, this is the version I wish you would add as a first class Nodebox node. Many of the new nodes I will soon be releasing depend on this one custom node.
John
Support Staff 9 Posted by Frederik De Ble... on 12 Jul, 2019 03:13 PM
Hi John,
Finally I found some time to look at some of the forum posts. My job has changed somewhat in the last year and going forward, I will have even less time to work on NodeBox. It's not part of my job description; personally I'm also in the process of building a house so I have very different engagements at the moment.
I don't think it's realistic to build entirely new functionality in NodeBox 3 for now. The curve node seems easy enough, and something I will consider soon.
Support Staff 10 Posted by john on 12 Jul, 2019 10:39 PM
Hi Frederik,
Thanks for letting us know. If you can find the time to publish one minor point release (maybe the last we will see for a very long time) please consider adding two other pieces of low-hanging fruit:
In priority order:
make_curve node
contours node (my second most commonly used custom node, often used with make_curve. I am attaching the one-line python code you wrote for easy reference.)
a fix for the option-drag bug (http://support.nodebox.net/discussions/nodebox-2-3/6122-option-drag...)
I can think of a few other quick improvements / bug fixes that would make a big difference without requiring entirely new functionality (e.g. publish as list/value http://support.nodebox.net/discussions/general-discussion/14887-fea...). I am also about to release a node library with over fifty nodes; a few of these are quite simple and might be worthy additions to the core. Let me know if you want any more ideas.
I can only imagine how busy you are with your house (congratulations) and your new teaching job. If you can give us one last point release before you go the entire community would greatly appreciate it.
John
11 Posted by joe.s.clay on 06 Jan, 2022 09:04 PM
make_curve is awesome. I was also wondering what sort of drawing access there is in Nodebox for custom nodes. So now I have another rabbit hole to dig into! Thanks, John! I'm currently rebuilding something I built in Processing that takes about 15 seconds in Nodebox thanks to you! AND it's more usable.
Support Staff 12 Posted by john on 06 Jan, 2022 11:19 PM
Hi Joe,
Yes, make_curve does provide a template for doing drawing chores in a custom node. I'm delighted you find it useful and am excited to see what new nodes you might make.
FYI, I no longer use make_curve myself. Instead I now use curve:
http://support.nodebox.net/discussions/show-your-work/430-curve-node
Curve is a subnetwork which works exactly like make_curve but does not require a custom code module. In addition to the above link you can also find it in version 3 of my Cartan Node Library.
Keep innovating!
John
13 Posted by joe.s.clay on 04 Feb, 2022 10:38 PM
Sorry for the delayed response. I got very busy. I must've missed that in the library. I'll check it out! I ended up making this with your node and a lot of tweaking in After Effects!
Support Staff 14 Posted by john on 04 Feb, 2022 11:18 PM
Joe,
That is beautiful. Glad you are putting my curve node to such good use.
I wonder if there is any way to create blurring effects like this in NodeBox.
John
15 Posted by gabriel sim-lar... on 27 Dec, 2022 02:11 AM
I never ended up using make_curve for that illustration. I did use nodebox for the main design (below).
I have grown by leaps and bounds in the last five years. Now I am much better at understanding programming ideas and I have revisited nodebox as a tool to create vector graphics for video, prints, and laser cutting.
I was very interested in the idea of being able to write nodebox nodes using the java awt. I am currently crawling through the nodebox.graphics library. I'm trying to understand what is NOT implemented in the current set of nodes, but is available from the java awt.
Is make_curve not included in the main release of nodebox because the philosophy is to keep things as simple as possible? It seems that there would be an explosion of nodes contributed if people realized how simple it is. Maybe I just missed where in the documentation there is a step-by-step description of how to make your own nodes.
Support Staff 16 Posted by john on 27 Dec, 2022 06:57 AM
Gabriel,
I don't think make_curve (now just curve) was omitted as a standard node for any philosophical reasons; it was just an oversight. When I suggested adding it, Frederik immediately agreed it should be standard (see above), but never found the time to do it.
I originally implemented make_curve as a (very simple) Python code module. But I later found a way to do it as a subnetwork ("curve") with no external code required. You can find it in my node library.
Most of the "nodes" in my library are actually subnetworks. The documentation on making subnetworks is sparse; you can learn more by searching the forum for threads about it or looking at the many subnetworks in my library as examples.
There is almost no documentation about rolling your own external code libraries. I had to figure out how to do it by painful trial and error. But I now have 15 Python modules and 1 Clojure module in my library so you can study those. That should at least give you a head-start.
I agree that java.awt is a treasure trove of useful functions that can easily be surfaced as nodes. My font_table.py library shows just one example. I would be delighted if you could publish some more.
My own preference is to avoid external code libraries whenever possible because it's a slight pain keeping track of them and making sure they stay in the right place when you copy or transport or publish your Nodebox networks. I also like the challenge of finding ways to do things entirely in NodeBox.
Your Rochester poster is quite lovely. I look forward to seeing more of your Nodebox work!
John