vlad-x / hobby-curves

Implementation of Hobby curves (Hobby splines) in javascript
GNU General Public License v2.0
11 stars 2 forks source link

Need help using this lib #1

Open louisremi opened 10 years ago

louisremi commented 10 years ago

Hi vladif,

I'm very interested in your port of the Hobby spline algorithm. I'd like to know how you got there (what sources you used exactly and how you converted them).

We're developing an open-source font editor and we want to integrate this algorithm in our app: https://github.com/byte-foundry/prototypo

We'd really appreciate to get in touch with you.

vlad-x commented 10 years ago

Hi Louis-Rémi, Nice to meet you and what a coincidence! In fact, I have seen Prototypo a while ago, and looking forward to what you guys are doing, it looks very cool so far!

As written here https://github.com/vladif/hobby-curves/blob/master/mp_path.js#L3 this is a half-automatic conversion from PyX, which is in turn, ported from MetaPost.

Before that, I've tried implementing it from scratch, which for some reason was incredibly hard because of cryptic specifications, then I've tried porting Hobby curves algorithm directly from MetaPost both manually, and by using Emscripten, but it turned out to be almost impossible to use, so I just found a python implementation of it in PyX, converted the syntax from python to javascript with some syntax converting tool and fixed the rest of the stuff by looking at the spec and the original MetaPost code.

Using it is very simple, here is an example https://github.com/vladif/hobby-curves/blob/master/mp_path.js#L34 makeknots converts an array of coordinate tuples into an array of knot objects (which is also a linked list, due to the C legacy), then, the first item of this linked list it passed to mp_make_choices which converts it into a bezier curve, and then function curve (https://github.com/vladif/hobby-curves/blob/master/test.js#L9) just draws the curve on a canvas.

I don't remember all the details, but feel free to drop me an email to vlad[at]difogic.com if you need any further help.

louisremi commented 10 years ago

Thank you Vlad, I'll look into it!

louisremi commented 10 years ago

Hi Vlad, I took the time to look at the example.

Here are a few additional questions:

Best regards, Lr

vlad-x commented 10 years ago

Hi Louis-Rémi,

  1. regarding Emscripten, I don't remember exactly, it was quite some time ago, it was very hard to extract only needed parts so I've tried to convert the whole MetaPost, but it turned out incredibly complicated, I've tried to hack & patch it, but gave up. It looks like it would take a lot of work to make it properly with Emscripten.
  2. they are in the "metapost" folder in PyX
  3. yes, you're right, the makeknots function converts and array of coordinates to a smooth curve, because it uses some preset values for ltype, rtype, ry_pt... etc. (see here https://github.com/vladif/hobby-curves/blob/master/mp_path.js#L434) but it must be possible to use different values to get different properties of the curve. Basically you can try to change makeknots or make your own implementation of it to get the behavior you need. To be honest it has been done in a completely wrong way, and it was just a fast hack to debug the algorithm. If you want to make it properly you better make your own implementation of knot data generation.
bingeli1212 commented 4 years ago

Hi vladif,

I am also interested in your implementation of the Hobby's algorithm. I am in the process of trying to integrate it to my project which is nitrile-preview on Github for drawing curves. I have already tried to run your code and examined the content of the array 'knots' returned by 'makeknots()'. It is very cool.

I just have one question. Does your code allow for similar functionality you would find in a MetaPost command such as: drawline (0,100){up}..(50,0){-1,-2}..{up}(0,0), where the right curl of the first point is to go up and the left curl of the last post is also to go up, and the middle point is to have its customized slanting parameter?

I have tested drawing a curve with three points (0,100), (50,0) and (0,0). The 'makeknots()' and 'mp_make_choices()' does not seems to have made it into a curve, but rather a straight line. so I believe the {up}, {-1,-2}, and {up} options for the three points will make a difference.

I do not mean for your code to parse the string this way, but is there a post-process configuration on your end that can be done like, after have done making the knots, to go to individual knots array to change some members to describe that the first point should go "up", the last point should also go "up", and middle point should have some desired slanting?

Many helps. I know the last posting of this thread was like 6 years ago. Hope you are still active on this project.

-James Yu