2

Код страницы формируется динамически.
Текст получаю в переменной, которая вставляет его в код. По этому обратиться к части текста и использовать textPath не могу.

Задача такая, уменьшить цифру после запятой. В примере с текстом 23,6 я могу сдвинуть цифру 6 вниз, а хотел бы просто сделать её маленькой.

<svg> 
 <text x="0" y="15 15 15 20">23,6</text> 
</svg>
7
  • а что в y означают цифры ? Commented 29 апр. 2020 в 9:53
  • Горизонтальное смещение каждого символа в тексте. Таким образом в моем примере цифра 6 сползет вниз. Commented 29 апр. 2020 в 11:00
  • круто ..это для меня новое Commented 29 апр. 2020 в 11:04
  • @СергейКазаков немного не точно объяснили. В SVG, если даже текст 23,6 введен обычным образом, через команду <text> то каждый символ превращается в векторный объект, который имеет координаты. Поэтому, записав y="15 15 15 20" оставляем первые три символа, включая запятую без изменений, а четвертый символ 6 смещаем вниз на 5 пикселей Commented 29 апр. 2020 в 13:25
  • Вот на этом свойстве отдельных координат каждого символа в слове сделал анимацию, смотрите примеры 5 и 6 ru.stackoverflow.com/a/1106346/28748 Commented 29 апр. 2020 в 13:32

1 ответ 1

2

Можно воспользоваться командой tspan, которая даст возможность применить различные стили к разным символам строки.

<svg> 
 <text x="0" y="15">
  <tspan font-size="18px">23,</tspan>
  <tspan  font-size="12px"> 6</tspan>
 </text> 
</svg>

15
  • это ндо какую то регулярку - как regExp споткнулась об запятую так и обернула всё что после в tspan Commented 29 апр. 2020 в 10:04
  • @MaximLensky: а зачем на сервере?
    – UModeL
    Commented 29 апр. 2020 в 10:04
  • ну написано что код страницы динамический а значит что будут проблемы с тем что бы ручками изменить Commented 29 апр. 2020 в 10:05
  • @MaximLensky: думаю, что просто неправильно сформулировано. Скорее данные динамические, а не сам код.
    – UModeL
    Commented 29 апр. 2020 в 10:07
  • 1
    надо подождать автора вопроса - ему виднее Commented 29 апр. 2020 в 10:08

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.