2016-04-01 4 views
0

Так что это сводит меня с ума :(. Я создаю документ svg с помощью D3, а затем передаю его в phantomJs и сохраняю вывод как .svg.D3 - append ('foreignObject') добавляет только текст и элемент tspan

в коде, я генерируя foreignObject следующим образом:.

svg.select("#def-commit") .append('foreignObject') .attr('width', 100) .attr('height', 100) .attr('x', 50) .attr('y', 50) .attr('requiredFeatures','http://www.w3.org/TR/SVG11/feature#Extensibility') .append('xhtml:p') .text("a big chunk of text that should wrap");

Теперь странная вещь, что сгенерированный документ не имеет foreignObject узел в DOM вообще вместо этого, что у него есть text и вложенный tspan. Нравится так:

<g xmlns="http://www.w3.org/2000/svg" id="def-commit"> <circle r="15" cx="0" cy="0"/> <text xmlns="http://www.w3.org/1999/xhtml"><tspan style="font-size: 11.5pt; font-family: &quot;sans-serif&quot;;" x="0" y="14.5">a big chunk of text that should wrap</tspan> </text> </g>

Что мне не хватает?

Дополнительная информация: D3 - последняя - 3.5.16 SVG декларация

<svg xmlns:xhtml="http://www.w3.org/1999/xhtml" id="mermaidChart0" width="1200" height="904.0178571428571" style="width: 1192; height: 904.0178571428571;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">

ответ

0

Таким образом, это оказалось большой дикий гусь погоня!

Немного фона - я пытаюсь добавить диаграмму в mermaid.

В репертуаре русалки есть код, который просматривает svg и заменяет все инородные объекты текстом/tspan :) Просто я никогда не представлял себе что-то подобное, и я не знаю, почему я просто не использовал grep источник, как я обычно делаю!

В случае, если кто делает здесь землю (хотя я сомневаюсь) - это здесь 'lib/phantomscript.js'

Спасибо за чтение.

Смежные вопросы