Как сжимать изогнутый текст без смещений?

Question

[historydev]

Доброй ночи.Я написал скрипт который отлично справляется с сжатием прямого текста.Но под изогнутый приходится прописывать море условий для корректной работы.Застрял я на последней табличке, можете посмотреть здесь: Ссылка
Так вот, вопрос в таков: Как сжимать его без смещений/уменьшений.
letter-spacing не катит
Использую расчёт transform: scale() процент от кол-ва символов на данный момент.

Comments

[Максим]

а SVG в данном случае не удобнее будет ?

[historydev]

Максим Ленский, svg это формат картинок или вы имеете ввиду что-то другое?

[Максим]

Владимир, SVG хоть и картинка но она динамичная и содержимым этой картинки можно управлять ...можно вставлять SVG прям в HTML и тогда этими тегами можно управлять на много проще чем span крутить и вертеть

[historydev]

Максим Ленский, типо тег или что?Покажи пример пожалуйста

[historydev]

Максим Ленский, я библиотеку юзаю для изгиба,а остальное трансформациями

[Максим]

Владимир, https://codepen.io/topicstarter/pen/OJLYdpv это в общих чертах

[historydev]

Максим Ленский, ого, спасибо!А если я его буду скалить,он не сломается?

[Максим]

Владимир, SVG адаптивно кроссбраузерно и абсолютно поддерживается всеми устройствами и скалить его не надо

[historydev]

Максим Ленский, я имею ввиду что будет с текстом если я применю transform: scale() или как мне достичь результата который у меня сейчас?Чтобы в любом изгибе он сжимался одинаково.Спасибо

[Максим]

Владимир, scale делать не надо -

[Максим]

Владимир, https://codepen.io/topicstarter/pen/OJLYdpv - это к примеру ваша декорация ...не доделал но не сложно

[historydev]

Максим Ленский, суть я уловил но, мне нужно в фиксированную ширину вместить 100 символов и более, как решить?

[Максим]

Владимир, javascript знаете ?

[historydev]

Максим Ленский, весь скрипт по ссылке на jquery написан

[Максим]

Владимир, jquery или нативный не важно но самостоятельно изменить сможете jquery код ?

[historydev]

Максим Ленский, да,конечно

[historydev]

Максим Ленский, его же я написал

[Максим]

Владимир, вот и прекрасно ...в люстре или в другом редакторе берёте пути svg изображения и подменяете при клике их ...понимаете ?

[historydev]

Максим Ленский, буквы сами будут подстраиваться или что?Я заменяю их при событии ввода и меняю на значение инпута.Мне нужно делать это только для путей свг?

[Максим]

Владимир, мне на работу пора ..но смотри - у тебя есть типо изображения того что хочет выбрать заказчик...он кликает по нему( так у меня работает твой пример) и меняется первая рамка( внешний вид) ...к этой рамке идёт текст который отрисован заранее ...по textPath и при клике или вводе меняешь path - понял ?

[Максим]

Владимир, на крайний случай - задай вопрос на ru.stackoverlow.com есть такое задание и ты хочешь его перепилить на svg - я сделал так но посоветовали сделать на svg - и там подробно объяснят что да как ...

[historydev]

Максим Ленский, мне менять в path путь к изображению?(d="")

[Максим]

Владимир, именно так ..именно менять d

[historydev]

Максим Ленский, а что там за цифры, где найти пример и описание параметров?

[historydev]

Максим Ленский, я ввёл много текста, а он не выводится весь..

[Максим]

Владимир, цыфры можно руками написать - это обычный координаты по оси X и по оси Y, а вот по поводу текста менять font-size в зависимости от кол-ва текста ... или делать карточку больше так что бы вместилось

[historydev]

Максим Ленский, ну это я понял да, хорошо, спасибо, попробую разобраться что здесь и как