search

fabricjs / fabric.js

Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser
http://fabricjs.com
Other
28.93k stars 3.5k forks source link

Add support for vertical text #511

Open raichu opened 11 years ago

raichu commented 11 years ago

Vertical text is very commonly used with CJK text, so please please :)

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

asturur commented 2 years ago

hey @thuytv-scuti thank you! i ll check as soon as possible. I m coming back after a pause and have a backlog to clear

thuytv-scuti commented 2 years ago

@asturur I have created a repo for it https://github.com/thuytv-scuti/fabric-CJK-vertical

asturur commented 2 years ago

thanks. If there is useful code to make vertical text work, what is your preference to integrate it?

thuytv-scuti commented 2 years ago

thanks. If there is useful code to make vertical text work, what is your preference to integrate it?

What do you mean of preference, I am using your work free of charge, that's my preference if it ok.

asturur commented 2 years ago

Sure i mean, if that code brings to working vertical text ( i did not look at it yet ) do you want to open a PR by yourself to have the work recognized on a commit? How can we eventually recognize your work.

asturur commented 2 years ago

~~i don't think is agnostic. It could be, but probably it isn't. I think it depends from which Math library the javascript engine links in. You can have tests failing in node and not in browser or failing in firefox and not in chrome, even just with matrices code. At leat it happened to me and that is why some tests have the toFixed() hack~~

wrong thread

thuytv-scuti commented 2 years ago

Sure i mean, if that code brings to working vertical text ( i did not look at it yet ) do you want to open a PR by yourself to have the work recognized on a commit? How can we eventually recognize your work.

Oh yeah, I sure want my work to be recognize, I will open a PR by myself ^^. But my current code comes in difference convention compare to fabric core, so I will need sometime to convert it to proper convention.

carior commented 2 years ago

@asturur I have created a repo for it https://github.com/thuytv-scuti/fabric-CJK-vertical

When displayed vertically, stretching deforms the text

thuytv-gl commented 1 year ago

Hi @carior, I was busy for few months and not working on this feature at all.
I am started working on the vertical text support on this github account, will open a PR asap!

ruojianll commented 1 year ago

This feature is inneed.

xiaowangsmile commented 9 months ago

This feature is inneed.

thuytv-gl commented 9 months ago

@ruojianll @xiaowangsmile I have a pretty old working prototype here, please take it if you find it useful https://github.com/thuytv-gl/fabric-CJK-vertical btw, @carior I fixed the stretching problem on recent commit

https://github.com/fabricjs/fabric.js/assets/107306319/a0564361-58fb-439f-aa96-5e929b42e4fe

new-sankaku commented 1 week ago

Modifications have been made to the prototype. -Added top, center, and bottom alignment functions. -Rotated the characters a-zA-Z0-9 to write vertically (i.e. the same angle as normal horizontal writing).

Currently, the following issues remain. -Text2VerticalText function doesn't work properly. -Using "Line Height" multiple times causes the display to become distorted. -"Character Spacing" has not been implemented at all. -The font's Y and X axes do not scale when the top, bottom, left, or right corners of the box are grabbed. -The font size does not scale when the top, bottom, bottom, left, or top left corners of the box are grabbed. -Gradients do not work.

I think I'll be able to create something that works if I can fix the remaining issues.

Demo site：You can try it out in action on our Demo site. https://new-sankaku.github.io/fabric-CJK-vertical/

image

xiaowangsmile commented 6 days ago

Modifications have been made to the prototype. -Added top, center, and bottom alignment functions. -Rotated the characters a-zA-Z0-9 to write vertically (i.e. the same angle as normal horizontal writing).

Currently, the following issues remain. -Text2VerticalText function doesn't work properly. -Using "Line Height" multiple times causes the display to become distorted. -"Character Spacing" has not been implemented at all. -The font's Y and X axes do not scale when the top, bottom, left, or right corners of the box are grabbed. -The font size does not scale when the top, bottom, bottom, left, or top left corners of the box are grabbed. -Gradients do not work.

I think I'll be able to create something that works if I can fix the remaining issues.

Demo site：You can try it out in action on our Demo site. https://new-sankaku.github.io/fabric-CJK-vertical/

image

This is really great. I hope you can solve these problems as soon as possible. Looking forward to your results

asturur commented 4 days ago

Vertical text would be nice to add but would require a full text rewrite in fabric imho. I was planning that those days but is so much work i got scared and i started to do something else.

xiaowangsmile commented 3 days ago

Vertical text is very important for countries in East Asia, and we hope the author can restart the project as soon as possible. Thank you very much