Я нашел решение для моего предыдущего вопроса. Мне нужно было изменить формат graphml
на svg
. Я запускаю тестовые примеры из статья, но с ней что-то не так, svg не отображается должным образом, но выводится так, как будто это правильно.
Мой тест.xml:
<graph edgedefault="directed">
<node id="n1"/>
<node id="n2"/>
<node id="n3"/>
<node id="n4"/>
<node id="n5"/>
<edge source="n1" target="n2"/>
<edge source="n1" target="n5"/>
<edge source="n1" target="n3"/>
<edge source="n2" target="n4"/>
</graph>
И использовал xslt
:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/2000/svg">
<xsl:output method="xml" version="1.0" encoding="UTF-8" indent="yes"/>
<xsl:template match="graph">
<!-- when finding a 'graph' element, create the 'svg' root and its 'defs' section -->
<svg>
<defs>
<marker id="arrow" refX="5" refY="5" markerUnits="userSpaceOnUse" markerWidth="10" markerHeight="10" orient="auto">
<path fill="black" d="M0 0 10 5 0 10z"/>
</marker>
</defs>
<!-- for each 'node' create a 'g' element with its contents -->
<xsl:for-each select="node">
<g>
<rect width="100" height="100" fill="silver"/>
<text style="font-size:24;font-weight:bold">
<xsl:value-of select="@id"/>
</text>
</g>
</xsl:for-each>
<!-- for each 'edge' create a 'line' with the arrow if it is a 'directed' edge -->
<xsl:for-each select="edge">
<line>
<xsl:if test="not(@directed='false')">
<xsl:attribute name="style">marker-end:url(#arrow)</xsl:attribute>
</xsl:if>
</line>
</xsl:for-each>
</svg>
</xsl:template>
</xsl:stylesheet>
Результат использования выглядит так, как если бы все прямоугольники переместились в координаты 0,0:
Результат svg-кода
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg">
<defs>
<marker id="arrow" refX="5" refY="5" markerUnits="userSpaceOnUse" markerWidth="10" markerHeight="10" orient="auto">
<path fill="black" d="M0 0 10 5 0 10z"/>
</marker>
</defs>
<g>
<rect width="100" height="100" fill="silver"/>
<text style="font-size:24;font-weight:bold">n1</text>
</g>
<g>
<rect width="100" height="100" fill="silver"/>
<text style="font-size:24;font-weight:bold">n2</text>
</g>
<g>
<rect width="100" height="100" fill="silver"/>
<text style="font-size:24;font-weight:bold">n3</text>
</g>
<g>
<rect width="100" height="100" fill="silver"/>
<text style="font-size:24;font-weight:bold">n4</text>
</g>
<g>
<rect width="100" height="100" fill="silver"/>
<text style="font-size:24;font-weight:bold">n5</text>
</g>
<line style="marker-end:url(#arrow)"/>
<line style="marker-end:url(#arrow)"/>
<line style="marker-end:url(#arrow)"/>
<line style="marker-end:url(#arrow)"/>
</svg>
x
иy
-- можете ли вы опубликовать полученный код svg ? - person philipp   schedule 02.11.2016