{"id":214,"date":"2011-02-05T02:30:44","date_gmt":"2011-02-04T18:30:44","guid":{"rendered":"http:\/\/konsolscript.sf.net\/web\/?p=214"},"modified":"2011-03-02T21:41:57","modified_gmt":"2011-03-02T13:41:57","slug":"flash-compatible-vector-curve","status":"publish","type":"post","link":"http:\/\/konsolscript.sourceforge.net\/web\/2011\/02\/05\/flash-compatible-vector-curve\/","title":{"rendered":"Flash-compatible vector curve"},"content":{"rendered":"

As you would already know, Quixie is using Cairo for rendering vector<\/a> graphics. Flash is using Quadratic Bezier curves<\/a> while Cairo uses Cubic Bezier curve<\/a>.<\/p>\n

After implementing Quadratic Bezier curve, I tried creating a heart and a circle for a simple Valentine’s Day demo, until I noticed something. The image below displays the progress made to Quixie to draw a vector curve that is similar to how Flash renders a curve.
\n

\"hearts\"<\/a><\/center><\/p>\n

Go and click the image to view larger.<\/p>\n

Not sure if it’s just me but it’s only know that I realize that using cubic over quadratic seem to produce better shapes. Don’t know about you guys, but I think the previous implementation of curve-rendering draws the heart and the circle much better.<\/p>\n

As expected, looks like Quixie will have to employ both Quadtratic and Cubic Bezier curves, using CurveTo<\/code> and a new Draw function CubicCurveTo<\/code>.<\/p>\n

Also, Cairo doesn’t seem to negate (can’t pick out the right word here) to overlapping shapes. Notice the hole where the heart and circle collided on Flash’s implementation?<\/p>\n

You might be wondering why is it so important that Quixie will render vectors the way Flash do. The simple answer is, “easy adaptation” — the same reason DOC, XLS and PPT files can be opened with OpenOffice<\/a>. Still, Quixie is not being developed to be an open source alternative to the Flash Player — Gnash<\/a> development team has already been working on it.<\/p>\n

By the way, the quadratic beziers are converted into Cairo’s cubic bezier by an algorithm from Mono project<\/a> — the Moonlight’s moon_curve_to<\/code> function.<\/p>\n

~creek23<\/p>\n","protected":false},"excerpt":{"rendered":"

As you would already know, Quixie is using Cairo for rendering vector graphics. Flash is using Quadratic Bezier curves while Cairo uses Cubic Bezier curve. After implementing Quadratic Bezier curve, I tried creating a heart and a circle for a simple Valentine’s Day demo, until I noticed something. The image below displays the progress made […]<\/p>\n","protected":false},"author":1,"featured_media":251,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[10,9,19],"_links":{"self":[{"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/posts\/214"}],"collection":[{"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/comments?post=214"}],"version-history":[{"count":0,"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/posts\/214\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/media\/251"}],"wp:attachment":[{"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/media?parent=214"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/categories?post=214"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/konsolscript.sourceforge.net\/web\/wp-json\/wp\/v2\/tags?post=214"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}