Home > Flex, Math > Text Along a Spline III

Text Along a Spline III

October 8, 2008

Here is an update on the new arc-length parameterizaton for the cubic Bezier spline.  The current algorithm lacks a certain elegance I would normally desire, but it’s a reasonable starting point.  I’m hoping performance will be be good, but that still needs to be stress tested.

The following screenshot shows a much longer text string than in previous examples and a longer spline with numerous inflections.

Text oriented along a cubic Bezier spline

Text oriented along a cubic Bezier spline

The example is still a bit crude, but it’s getting there🙂 The cubic Bezier spline is currently optimized for fast drawing (it was intended to be used in animation), so it performs a minimal number of subdivisions in each segment, meaning that for static plots, it is not drawn accurately.  There will be certain letters that appear to ‘pull away’ from the spline that are an artifact of this implementation.  Also, only the text width and height are taken into account when placing text in the current demo; the font metrics are not currently used.

In the Degrafa port, the FastBezier class will be replaced by the Degrafa cubic Bezier, so the spline will be suitable for static drawing.

Another refinement that will probably make its way into a future version of the code is to look at the curve tangent halfway along the width of the letter as opposed to the current approach of estimating the tangent at the beginning of the letter. Next step, however, is to handle instances where the text string extends beyond the final spline knot.

Categories: Flex, Math Tags: , , ,
  1. JT
    October 10, 2008 at 8:38 am

    Interesting, but I still want to see a tutorial when it’s all done.

  2. Colin Shreffler
    December 9, 2008 at 12:24 pm

    I’m sure you are getting this question a bit… but do you have an example of text along a curve using the Degrafa framework? I am working on a project that could use this TODAY. Nothing like asking for the free code NOW😉 But if you have an example of this I’d love to see it.

  1. No trackbacks yet.
Comments are closed.
%d bloggers like this: