Canvas and drawing a text along an arc path

264 views
Skip to first unread message

Philippe Ameline

unread,
Feb 27, 2015, 6:10:42 AM2/27/15
to google-we...@googlegroups.com
Hello,

I was previously using SWTBCanvasText (an extension of GWTCanvas) to draw some text along a circle segment.
Since GWTCanvas is deprecated, I recently made the move to the regular Canvas in GWT.

It is possible to draw a text along a path, as shown in :
http://www.w3.org/Graphics/SVG/IG/resources/svgprimer.html#text

<defs>
<path id="curve" d="M 10 100 C 200 30 300 250 350 50" stroke="black" fill="none" stroke-width="5" />
</defs>
<text id="T" style="font-family:ariel;font-size:16">
<textPath xlink:href="curve">Hello, here is some text lying along a bezier curve.</textPath>
</text>


Basically, given a path with an Id (here "curve"), it is possible to create a textPath linked to this Id.

Unfortunately, I can't see how I can do this in the Context2d class.

Of course, I could draw the text letter after letter like in example herunder, but I would prefer using integrated function.
http://www.html5canvastutorials.com/labs/html5-canvas-text-along-arc-path/

I could also integrate a massive library, but I don't consider it an option considering that, except for this issue, current Canvas class is fit for my needs.

Thanks for you advices,

Philippe
Reply all
Reply to author
Forward
0 new messages