text-path for a text

[serge-974]

Hi ! I need to add a text with a text-path (because the text must follow a path) . Do you think it's possible ? I search on github, and other website but i find nothing on raphaeljs for this. I try to modify raphael. js, to add my own function which can add a text-path, but I have difficulty to understand the code, because I am novice in SVG / VML. Could You help me? Thanks.

[semiaddict]

Hi,

I needed such functionality, and managed to do it with the help of the code of "HTML5 Text Path demo" (http://ohadpr.com/etc/proj/html5-text-demo) by Ohad Eder Pressman (http://ohadpr.com).

I created a Raphaël "plugin", called Raphael-TextOnPath, which is more of a custom method than a plugin, which does exactly that.

It is available at https://github.com/semiaddict/Raphael-TextOnPath .

Best,

Oussama Mubarak http://semiaddict.com

[matplane]

Hi,

I'm trying to add text-path on RaphaelJS too ...

Your work is interesting but if it's working well with linear path, your "plugin" still bugy with curve path.

Your plugin seems not generating original SVG/VML code for this "normalized" feature : a element "textPath" on a block "text" link by id of a path.

For exemple (svg) :

<path id="MyPath" d="M 175,250 a 100 100 0 0 0 450,0 a 100 100 0 0 0 -450,0" />
<use xlink:href="#MyPath" fill="#fff" stroke="red" />
<text>
    <textPath xlink:href="#MyPath">
          Ceci est un super Test
    </textPath>
</text>

I'm trying to create a new "class" for "theTextPath" based directly on RaphaelJS's code but I cannot succeed to create an element "textPath". I have always, by different methods of creation, a "textpath" block that not working on svg standards.

I'm still working on it but I'm interresting by any help or any suggestion.

Mathieu Le Gac-Olanié http://matplane.com @mateoelgaco

[semiaddict]

Hi Mathieu,

Indeed, I am not creating the standard VML and SVG textPath elements.

My current code simply divides each text element into separate letters and draws that letter on the curve using the "text" method of Raphael. I've also noticed that my code can highly slow down the script execution for large amount of texts.

For more info on the method used, please refer to Ohad Eder Pressman's demo @ http://ohadpr.com/etc/proj/html5-text-demo/

I had tried to create the textPath elements, but failed due to the lack of time and the poor VML documentation. But I hope to get some time to do it early next year (January maybe).

If you've already started, maybe we can work on it together. Could you send me what you got so far by adding an issue @ https://github.com/semiaddict/Raphael-TextOnPath/issues?

Best,

Oussama Mubarak http://semiaddict.com

[shaunwallace]

The link for the textPath is broken. Did you ever get a chance to work on the textPath functionality for Raphael?

[semiaddict]

yes I have, please check my pull request: https://github.com/DmitryBaranovskiy/raphael/pull/273

[petecocoon]

Hi to everybody, i've added a text on path feature only on SVG. Please check https://github.com/petecocoon/raphael

[zakdances]

Looks like @semiaddict 's pull request was rejected. Any further development on this issue?

[geroi]

Looks like no activity for this issue. Any further development on this issue?