Описание тега tspan

1 ответ

Выравнивание по центру верхнего чарта в текстовом теге

Я хочу выровнять tspan центр внутри text тег старшей диаграммы. Я создал один jsfiddle: здесь Код Highcharts.chart('container', { chart: { type: 'pyramid' }, title: { text: 'Sales pyramid', x: -50 }, plotOptions: { series: { dataLabels: { enabled: t…
26 мар '18 в 20:51
1 ответ

Проблема с SVG Tspans не выравнивается с text-anchor="end"

У меня есть немного кода, как это: svg {font-family:Verdana,sans-serif;color:#000;} .key {font-size:75%;overflow:visible;} .caphgh {font-weight:bold;} .keynor {font-weight:normal;} .keysub {font-weight:normal;font-size:85%;} .keyshf,.keyctl,.keyalt …
28 дек '16 в 15:19
2 ответа

SVG TSPAN горизонтальное смещение

Я пытаюсь понять тег tspan в SVG и вот что-то странное. Посмотрите на следующий код, FF и Chrome вводят горизонтальное смещение между значениями tspans, но их не должно быть. <svg width="625" height="470" xmlns="http://www.w3.org/2000/svg"> &l…
17 июл '11 в 17:22
0 ответов

Text decoration of SVG tspan

I'm seeing inconsistent rendering of SVG <tspan> elements in regards to text-decoration. Using this simple testcase: <text font-family="Helvetica" x="0" y="50" font-size="30" text-decoration='underline overline'> outer text <tspan fon…
12 янв '15 в 16:22
1 ответ

При добавлении нескольких дочерних элементов tspan к текстовому объекту SVG каждый раз нужен новый дочерний элемент?

Я не уверен, лучший способ спросить это. Я хочу добавить несколько дочерних элементов tspan в один текстовый объект SVG. У меня есть следующий код. var tspanElement = document.createElementNS("http://www.w3.org/2000/svg", "tspan"); var majNote1 = do…
01 янв '16 в 02:41
0 ответов

D3js - обновление tspan не работает на Chrome

Chrome не рендерится, если я обновлю tspan динамически с помощью text(): <html> .... <text id="small-text" style="color: #FFFFFF" fill="white"> <tspan id="small-text-span1" style="font-size:18px;color:#FFFFFF;" ></tspan> <…
03 окт '13 в 00:47
2 ответа

D3.js добавить TSPAN к текстовому элементу

У меня есть гистограмма D3. При наведении курсора мыши на одну из полос появляется текст. Но я бы хотел, чтобы появилась еще одна строка текста. Для этого мне нужно добавить элемент . Я видел примеры, но не могу заставить добавить к текстовому элеме…
13 фев '17 в 23:11
1 ответ

Вычисление вертикальной высоты текста SVG

У меня есть массив строк. Сказать, ['Jan 11','Feb 11'] И я создаю вертикальный текст с этими строками так <text x="60" y="154" text-anchor="middle" style="text-anchor: middle; font: normal normal normal 12px/normal Helvetica, Arial; " font="12px …
13 окт '11 в 13:19
1 ответ

Почему атрибут SVG tspan y изменяет горизонтальное выравнивание текста?

HTML: <svg> <g transform="translate(100, 100)"> <circle r="3"></circle> <text text-anchor="middle"> Test<tspan y="2">xxxxxxxxxxxxxx</tspan> </text> </g> </svg> xПересекается с Test, Я не по…
21 ноя '15 в 12:27
1 ответ

ng-bind-html в текстовом теге svg не отображает tspan в Firefox и IE

Я не могу создать SVG с angularjs, когда tspan загружается из атрибута ng-bind-html, Firefox и IE не отображают их. Мой контроллер выглядит так: $scope.titlenotok="svg not ok"; var content = '<tspan dy="20" x="0" xml:space="preserve">line1 not…
02 июл '14 в 15:27
1 ответ

Canvg() проблема с перекрытием TSPAN

Мне нужно преобразовать элемент SVG в PNG. при преобразовании в png текст перекрывается и не выравнивается должным образом. Фактическое изображение выглядит так: введите описание изображения здесь Изображение после преобразования выглядит так: введи…
10 июл '17 в 14:24
1 ответ

D3.JS Динамически заменить <tspan>

Я использую пример солнечных лучей в качестве основы и пытаюсь изменить многослойный заголовок при клике с новыми данными. Функция щелчка выглядит так: function click(d) { text.transition().attr("opacity", 0); console.log(d.depth); path.transition()…
08 дек '16 в 20:10
1 ответ

SVG: отступ в тексте / пробел в последнем tspan в группе элементов tspan

Этот код вставляет пробел в последнюю часть группы элементов tspan, в результате чего последняя строка текста выпадает из выравнивания (по оси X). Если вы добавляете / удаляете элементы tspan из группы, такое поведение всегда отображается в последне…
19 дек '18 в 07:54
1 ответ

Используете многоточие с TSPAN SVG?

У меня есть страница, где мы используем SVG для визуализации диаграммы последовательности. Некоторые из представленных данных могут быть очень длинными, поэтому я хотел бы ограничить ширину элементов TSPAN и предоставить многоточие, позволяя пользов…
07 окт '13 в 23:48
1 ответ

Добавление изображения в <tspan>

У меня есть этот код: &lt;svg&gt; &lt;text&gt; &lt;tspan x='8' dy='16' id='china'&gt;" + ¥5,000.00 + "&lt;/tspan&gt; &lt;/text&gt; &lt;/svg&gt; Это показывает мне это: ¥5,000.00 Я хочу показать мне флаг Китая, вот так: Перепробовал много способов, н…
03 фев '16 в 23:08
3 ответа

Пометить текст в g ​​преобразовать css в пульсировать

Я получил шаблон в данных SVG. Здесь у меня есть текст, который я хотел бы пульсировать. Html: &lt;tspan class="text animated pulse" x="14.325" y="39.18"&gt;50&lt;/tspan&gt;&lt;/text&gt; это не работает Вот ссылка на коде
17 авг '18 в 12:40
1 ответ

Почему программно вставленные элементы SVG <tspan> не отображаются, кроме как с помощью d3.js?

Скажем, я хочу программно вставить дополнительный &lt;tspan&gt; в &lt;text&gt; элемент в следующем SVG: &lt;svg width="300" height="500"&gt; &lt;text x="50" y="100"&gt; &lt;tspan x="50"&gt;one&lt;/tspan&gt; &lt;tspan x="50" dy="20"&gt;two&lt;/tspan&…
22 май '13 в 20:43
0 ответов

Выравнивание SVG сгруппированных tspan в разных браузерах

Чтобы адаптировать веб-страницу, я перенес графику и элементы div в изображение SVG. Само imgae теперь отлично работает во всех браузерах. Но я также перенес динамически заполненные текстовые отрывки в SVG с &lt;text&gt; а также &lt;tspan&gt;элемент…
14 фев '18 в 08:03
2 ответа

svg - <tspan> внутри <text> не отображается в FF и Safari

Я пытаюсь понять, почему текст внутри &lt;tspan&gt; не видны в FF (v31) и Safari (в Chrome это работает). Код, который генерирует тексты: var year_elements_text = document.createElementNS(NS, "text"); year_elements_text.setAttribute('x', String((i *…
07 сен '14 в 23:20
0 ответов

D3.JS <tspan> вращение в солнечных лучах

Я строю свою собственную диаграмму солнечных лучей из этого примера, добавляя многострочные заголовки как , for(i = 0; i &lt; MAX_LINES; i++){ var text = g.append("text") .attr("transform", function(d) { return "translate(" + getCentroid(d) + ")rota…
07 дек '16 в 14:49