Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

New Bézier curves for vector graphics

ad8e.pages.dev

Post reply on HN
Print view View original

41–50 of 61 posts

Re: New Bézier curves for vector graphics

#41

Post by crazygringo »

bobbylarrybobby wrote: post #32

Are Bézier curves with handles “worth it”? I've always found the easiest method for drawing curves to be, simply, “give me the (cubic) spline curve that goes through these points”. You place your points and continuity conditions determine the cubic, as described in https://mathworld.wolfram.com/CubicSpline.html .

That's exactly what I've always been curious about!

It seems vastly more intuitive to place points rather than adjust handles. (And set directions for endpoints if the curve is open.)

And obviously a practical tool will provide the capability to join separate cubic splines at sharp angles.

Does anyone know of a GUI drawing tool based on this? I've always wanted to experiment with it. Because I've always wanted to either confirm that it's a great idea that we should all be using instead of beziers, or else discover if there's an immediately obvious reason once you try it out that it's a terrible idea.

Re: New Bézier curves for vector graphics

#42

Post by ad8e »

TheRealPomax wrote: post #35
mkl wrote: post #33

Earlier quoted context omitted.

Fonts are supposed to contain perfect circles; try searching for "circle" in a Unicode character map. They only don't in practice because quadratic and cubic Bezier splines can't do them.

And they don't have to. The approximation of a circle with a bunch of cubic curves is so accurate [1] that you'd need to print a huge circle and then sit there with a measuring tape to be able to even tell it's not a perfect circle. Which is why "you can't draw a circle with Bezier curves" is only a mathematical "problem", it's not an actual problem. [1] https://pomax.github.io/bezierinfo/#circles_cubic

It's a UI problem, not a mathematical problem. No set of curves can represent everything exactly, but they all can get close. The goal is just to make it easy to get close.

The computer can produce a near-perfect circle with Béziers for each 1/4 arc, and near-perfect circles are usually good enough. It's just inconvenient. It's also hard to manipulate the generated circle; the user might have a clear image of his head of the changed circle he wants, but pushing the control points to get there is not easy.

The mathematical "axioms" in the article are only attempting to provide a clean interface, so that the user can easily translate what is in his head to what the program creates. The circle axiom says, "The user often wants a circle, and also expects a circle, so let's produce the expected circle." There's no other mathematical purity involved.

Re: New Bézier curves for vector graphics

#43

Post by crazygringo »

CharlesW wrote: post #29
slimsag wrote: post #11

Cool to see others working on this problem. I hope more people do. Funnily I've seen a lot of programmers and math folks who express how truly, genuinely beautiful Beziers and the math behind them are. But I've never met an artist or graphic designer who didn't express some deep frustration at Bezier controls and how hard they are to work with. There are even games[0] which make a mockery out of how hard Bezier contr…

> But I've never met an artist or graphic designer who didn't express some deep frustration at Bezier controls and how hard they are to work with. That surprises me, because Illustrator (especially earlier versions) is all about Bezier curves, and in my experience it doesn't take long before you start to "think" like the Pen tool. I don't recall working with an artist who couldn't intuit how they worked after creatin…

You can easily learn how to use them.

That doesn't mean they don't stop being frustrating.

I will commonly wish there was a method to change a curve in a single drag in some particular situation, rather than 20 drags of fiddling with beziers, trying to figure out if adding another control point is necessary or redundant.

Just because you figure out the intuition behind them doesn't turn them into an efficient way of achieving results. Because the intuition of beziers translates poorly to our innate human/artistic intuitions of curves.

Re: New Bézier curves for vector graphics

#44

Post by bsder »

TheRealPomax wrote: post #37

It looks like the conclusion is "let's use rational Bezier curves instead of plain Bezier curves", in which case: you can, you just have more parameters to tweak now. Also calling this "new" is a bit disingenous given that rational Beziers have been around half a century now. They're useful, but if you only look at Bezier curves from the tooling side of things, you're going to miss the reason why we use them so much.…

This article is really stretching when the conclusion is smacking him in the face: "Use quadratic Beziers."

The original article points out that quadratic Beziers have most of the desirable properties with very few of the downsides.

It used to be that the issue was that you would have to use significantly more quadratic Beziers to approximate something that a much smaller number of cubic Bezier's could do. This was a big deal when a font file might clog up a floppy disk.

Now that we're slinging around gigabyte patch files. Do we really care?

Re: New Bézier curves for vector graphics

#45

Post by atan2 »

AlphaCerium wrote: post #23
Nycto wrote: post #8

Obligatory links for anyone that is interested in learning more about Bézier curves: https://pomax.github.io/bezierinfo/ https://pomax.github.io/bezierjs/ https://github.com/Pomax/bezierjs

Might I also add: https://youtu.be/aVwxzDHniEw?feature=shared Which works through them from first principles with beautiful animations.

I personally really like this video, but it's interesting how when I showed it to a group of CS undergrad students, they all loved the animations but performed poorly on a post-video quiz about the topic. I knew the content already, but I wonder if this video is really as educational as it appears to be.

Re: New Bézier curves for vector graphics

#46

Post by anon____ »

Nycto wrote: post #8

Obligatory links for anyone that is interested in learning more about Bézier curves: https://pomax.github.io/bezierinfo/ https://pomax.github.io/bezierjs/ https://github.com/Pomax/bezierjs

These, too:

https://ciechanow.ski/drawing-bezier-curves/

https://ciechanow.ski/curves-and-surfaces/

Re: New Bézier curves for vector graphics

#47

Post by ad8e »

raphlinus wrote: post #40
egypturnash wrote: post #27

"I don't know of a reasonable way to guess the right location." 1. Drag curve handles out to 1/3 of the length of the curve segment they control. 2. Eschew s-curves between two control points. 3. Don't turn more than about 90º between two control points. I learnt this about a year into what is now a 23-year career as an Illustrator artist. It has served me well. You will note that the first interactive example on thi…

I can perhaps refine (1) and provide some insight in support of (2). It does make intuitive sense for handles to be 1/3 of the length of the curve, as that makes the "speed" close to constant, but this is not the smoothest possible choice in general. In particular, it's not the best approximation to a circular arc, which by most reasonable definitions is the smoothest possible curve. I did the math[1] and found that…

The ideal dimensionality of the parameter space depends on the jaggedness of the curve. Derivatives are useful when they stay constant over a stretch of time; when derivatives vary too much, it becomes more efficient to use more points of lower degree. This is the same calculation in other domains of approximation: numerical integration, DiffEq, and Taylor series.

For example, to draw rough surfaces, point-to-point lines are the most efficient way, with a ton of points. For industrial geometric shapes, lines and ellipses become efficient. As the smoothness of the curve goes up, more derivatives become valid. But sometimes those higher derivatives are not useful.

This is why the parent comment likes the Pencil tool; it's optimal for high variation, because it is a local (smoothed) control of position, the zeroth derivative. The cost is some loss of smoothness, which likely doesn't matter for her domain, since her hands move smoothly enough.

I think the Pen tool would be a more competitive alternative with a better control scheme. For example, a Pen tool with local control would unify the Pencil and Pen: letting you draw jagged curves by holding your mouse down, and letting you draw straight lines and smooth curves by clicking. There would be no interruption of flow, as you can use either method freely to continue a curve. They should inherently be the same tool anyway, just with different numbers of derivatives.

Re: New Bézier curves for vector graphics

#48

Post by ad8e »

crazygringo wrote: post #41
bobbylarrybobby wrote: post #32

Are Bézier curves with handles “worth it”? I've always found the easiest method for drawing curves to be, simply, “give me the (cubic) spline curve that goes through these points”. You place your points and continuity conditions determine the cubic, as described in https://mathworld.wolfram.com/CubicSpline.html .

That's exactly what I've always been curious about! It seems vastly more intuitive to place points rather than adjust handles. (And set directions for endpoints if the curve is open.) And obviously a practical tool will provide the capability to join separate cubic splines at sharp angles. Does anyone know of a GUI drawing tool based on this? I've always wanted to experiment with it. Because I've always wanted to eit…

I have used this in some commercial software before (maybe Illustrator?); my experience was not positive. When you move a node, some not-so-close curves start wiggling, and you think, "I already set that part correctly, stop moving please". It behaves very poorly around rounded corners. Adding points causes the curves to shift, usually not how you want, and then you try to add more points, which causes more shifts, etc. Arc length-based interpolation might do better in this respect, as opposed to the (# of points)-based interpolation which I expect it used.

The alternative, which obeys similar principles, is the Pencil tool. This simply spams out a ton of points to match what you draw. https://news.ycombinator.com/item?id=37460009 mentions that these points can be capably reduced, which could serve your purpose.

Re: New Bézier curves for vector graphics

#50

Post by ad8e »

TheRealPomax wrote: post #37

It looks like the conclusion is "let's use rational Bezier curves instead of plain Bezier curves", in which case: you can, you just have more parameters to tweak now. Also calling this "new" is a bit disingenous given that rational Beziers have been around half a century now. They're useful, but if you only look at Bezier curves from the tooling side of things, you're going to miss the reason why we use them so much.…

There are a few misunderstandings here. Rational Bézier curves are incidental in this article, and the conclusion is not that they are correct. They were just a convenient curve I used to express the main message of local control, and the article endorses looking for other curves that fit the properties.

The parameter count has not gone up; it's equal to or less than usual Bézier control handles, because I forced the parameters to take specific values.

The part that is "new" about the Béziers is the new formula that selects one specific Bézier out of all the possible choices. I think this linguistic accusation is silly; for example, if someone discovers a new rock, it would be fair to call it a "new rock" even though rocks have been discovered thousands of years ago.

These curves are also unrelated to the file format; the curves are designed to fit how the user thinks about curves rather than be computer-efficient. For the tooling point, I think you are agreeing with me while arguing; I agree that there's no reason the curve should match what is used in the final product, and some of the other curve choices I considered require a complex conversion step.

Post reply on HN