SVG 到 SVG（？）的轉換
[英]SVG to SVG(?) conversion
問題描述
我有 SVG 格式的 AWS 資源圖標。 下面給出一個例子：
<?xml version="1.0" encoding="UTF-8"?>
<svg width="48px" height="48px" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>Icon-Resource/Storage/Res_AWS-Backup_Backup-Vault_48_Dark</title>
<g id="Icon-Resource/Storage/Res_AWS-Backup_Backup-Vault_48" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M10.298,22.955 L8.298,22.969 C8.333,27.982 10.654,32.573 14.668,35.564 C17.503,37.677 20.819,38.696 24.109,38.696 C28.942,38.696 33.717,36.496 36.82,32.332 C42.036,25.334 40.587,15.396 33.589,10.18 C26.813,5.13 17.297,6.345 11.963,12.775 L12,10.014 L10,9.987 L9.933,14.987 C9.929,15.252 10.031,15.508 10.216,15.698 C10.402,15.888 10.654,15.997 10.919,16 L15.986,16.068 L16.014,14.068 L13.513,14.035 C18.176,8.43 26.479,7.376 32.394,11.783 C38.507,16.341 39.774,25.023 35.217,31.137 C30.658,37.251 21.979,38.517 15.863,33.96 C12.357,31.347 10.328,27.335 10.298,22.955 L10.298,22.955 Z M24,19 C21.794,19 20,20.795 20,23 C20,25.206 21.794,27 24,27 C26.206,27 28,25.206 28,23 C28,20.795 26.206,19 24,19 L24,19 Z M16.946,28.78 L19.175,26.552 C18.441,25.556 18,24.33 18,23 C18,21.622 18.473,20.353 19.257,19.339 L16.947,17.191 L18.309,15.727 L20.729,17.977 C21.671,17.362 22.793,17 24,17 C25.342,17 26.577,17.448 27.577,18.195 L29.982,15.726 L31.414,17.121 L28.965,19.636 C29.617,20.597 30,21.754 30,23 C30,24.252 29.613,25.415 28.955,26.377 L31.414,28.756 L30.024,30.194 L27.565,27.815 C26.567,28.556 25.336,29 24,29 C22.742,29 21.574,28.61 20.61,27.946 L18.361,30.194 L16.946,28.78 Z M35,44 L39,44 L39,43 L35,43 L35,44 Z M9,44 L13,44 L13,43 L9,43 L9,44 Z M46,3 L46,42 C46,42.553 45.553,43 45,43 L41,43 L41,45 C41,45.553 40.553,46 40,46 L34,46 C33.447,46 33,45.553 33,45 L33,43 L15,43 L15,45 C15,45.553 14.553,46 14,46 L8,46 C7.447,46 7,45.553 7,45 L7,43 L3,43 C2.447,43 2,42.553 2,42 L2,33 L4,33 L4,41 L44,41 L44,4 L4,4 L4,11 L2,11 L2,3 C2,2.448 2.447,2 3,2 L45,2 C45.553,2 46,2.448 46,3 L46,3 Z M2,27 L4,27 L4,17 L2,17 L2,27 Z" id="Fill-1" fill="#6CAE3E"></path>
</g>
</svg>
Draw.io (diagrams.net) 從包含數百個形狀標簽的 xml 文件中檢索他們的圖標圖像。 其中之一如下：
完整的xml文件來源： https ://github.com/jgraph/drawio/blob/dev/src/main/webapp/stencils/aws4.xml
<shape aspect="fixed" h="47.651" name="backup" strokewidth="inherit" w="49.458">
<connections/>
<foreground>
<path>
<move x="24.731" y="0.045"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="21.02" x-axis-rotation="0" y="5.006"/>
<line x="6.458" y="15.131"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="1" x="6.456" x-axis-rotation="0" y="15.129"/>
<arc large-arc-flag="1" rx="4" ry="4" sweep-flag="0" x="4.337" x-axis-rotation="0" y="22.522"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="4.358" x-axis-rotation="0" y="22.522"/>
<line x="9.964" y="40.742"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="12.708" x-axis-rotation="0" y="47.651"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="16.589" x-axis-rotation="0" y="44.6"/>
<line x="33.206" y="44.6"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="37.087" x-axis-rotation="0" y="47.651"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="41.087" x-axis-rotation="0" y="43.651"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="39.749" x-axis-rotation="0" y="40.668"/>
<line x="45.235" y="22.51"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="45.458" x-axis-rotation="0" y="22.522"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="49.458" x-axis-rotation="0" y="18.522"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="43.36" x-axis-rotation="0" y="15.117"/>
<line x="28.796" y="4.922"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="28.897" x-axis-rotation="0" y="4.041"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="24.731" x-axis-rotation="0" y="0.045"/>
<close/>
<move x="24.897" y="1.951"/>
<arc large-arc-flag="0" rx="2.06" ry="2.06" sweep-flag="1" x="26.958" x-axis-rotation="0" y="4.01"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="24.897" x-axis-rotation="0" y="1.951"/>
<close/>
<move x="27.88" y="6.7"/>
<line x="41.973" y="16.563"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="41.538" x-axis-rotation="0" y="19.295"/>
<line x="36.692" y="21.373"/>
<line x="37.472" y="23.194"/>
<line x="42.391" y="21.084"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="43.343" x-axis-rotation="0" y="21.91"/>
<line x="37.952" y="39.75"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="35.774" x-axis-rotation="0" y="39.873"/>
<line x="33.337" y="36.215"/>
<line x="31.69" y="37.313"/>
<line x="34.126" y="40.965"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="33.227" x-axis-rotation="0" y="42.621"/>
<line x="16.567" y="42.621"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="15.665" x-axis-rotation="0" y="40.961"/>
<line x="18.097" y="37.313"/>
<line x="16.448" y="36.215"/>
<line x="14.009" y="39.873"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="11.737" x-axis-rotation="0" y="39.772"/>
<line x="6.274" y="22.016"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="7.405" x-axis-rotation="0" y="21.086"/>
<line x="12.319" y="23.194"/>
<line x="13.1" y="21.373"/>
<line x="8.259" y="19.297"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="8.337" x-axis-rotation="0" y="18.522"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="7.835" x-axis-rotation="0" y="16.582"/>
<line x="21.966" y="6.758"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="23.907" x-axis-rotation="0" y="7.91"/>
<line x="23.907" y="12.381"/>
<line x="25.888" y="12.381"/>
<line x="25.888" y="7.912"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="27.88" x-axis-rotation="0" y="6.7"/>
<close/>
<move x="24.593" y="15.366"/>
<arc large-arc-flag="0" rx="10.24" ry="10.24" sweep-flag="0" x="17.807" x-axis-rotation="0" y="18.246"/>
<line x="17.698" y="16.701"/>
<line x="15.698" y="16.84"/>
<line x="15.977" y="20.641"/>
<arc large-arc-flag="0" rx="1" ry="1" sweep-flag="0" x="16.977" x-axis-rotation="0" y="21.551"/>
<line x="17.048" y="21.59"/>
<line x="20.847" y="21.311"/>
<line x="20.698" y="19.311"/>
<line x="19.497" y="19.393"/>
<arc large-arc-flag="0" rx="8.26" ry="8.26" sweep-flag="1" x="29.837" x-axis-rotation="0" y="18.991"/>
<arc large-arc-flag="0" rx="8.25" ry="8.25" sweep-flag="1" x="31.528" x-axis-rotation="0" y="30.541"/>
<arc large-arc-flag="0" rx="8.26" ry="8.26" sweep-flag="1" x="19.977" x-axis-rotation="0" y="32.231"/>
<arc large-arc-flag="0" rx="8.15" ry="8.15" sweep-flag="1" x="16.657" x-axis-rotation="0" y="25.66"/>
<line x="14.657" y="25.66"/>
<arc large-arc-flag="0" rx="10.22" ry="10.22" sweep-flag="0" x="24.887" x-axis-rotation="0" y="35.82"/>
<line x="24.897" y="35.84"/>
<arc large-arc-flag="1" rx="10.24" ry="10.24" sweep-flag="0" x="24.593" x-axis-rotation="0" y="15.366"/>
<close/>
<move x="4.337" y="16.42"/>
<arc large-arc-flag="0" rx="2.06" ry="2.06" sweep-flag="1" x="6.337" x-axis-rotation="0" y="18.481"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="4.337" x-axis-rotation="0" y="16.42"/>
<close/>
<move x="45.458" y="16.42"/>
<arc large-arc-flag="0" rx="2.06" ry="2.06" sweep-flag="1" x="47.516" x-axis-rotation="0" y="18.481"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="45.458" x-axis-rotation="0" y="16.42"/>
<close/>
<move x="12.708" y="41.561"/>
<arc large-arc-flag="0" rx="2.05" ry="2.05" sweep-flag="1" x="14.766" x-axis-rotation="0" y="43.561"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="12.708" x-axis-rotation="0" y="41.561"/>
<close/>
<move x="37.087" y="41.561"/>
<arc large-arc-flag="0" rx="2.05" ry="2.05" sweep-flag="1" x="39.138" x-axis-rotation="0" y="43.561"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="37.087" x-axis-rotation="0" y="41.561"/>
<close/>
</path>
<fill/>
</foreground>
</shape>
不確定上述是否為 SVG。 然而，他們兩個似乎都有路徑標簽。 有沒有辦法將第一個轉換為第二個的格式？
謝謝。
3 個解決方案
解決方案1
1 2022-05-23 20:58:36
這看起來不像 SVG。 它可能是 draw.io自己的 XML 格式。
看到第一個不是圖表，我不明白如何將任何SVG直接轉換為表示圖表的draw.io XML文件； 特別是，因為第二個 XML 顯示的是“移動、繪制、移動”式繪圖突擊隊，這與 SVG 的工作方式完全不同。
因此，長話短說：雖然對於僅包含直線和拱門的 SVG 子集當然是可能的，但您需要自己實現一個生成器，以從 SVG 中實現必要的移動和繪制指令。 這遠非微不足道，因為 SVG 允許對所有這些元素進行范圍、組和轉換。
解決方案2
1 2022-05-24 07:07:16
我誤解了這個問題。 我會保留這個答案（也許有人會覺得它有用），但添加另一個希望更正確的答案。
可以使用 XSLT 將一種 XML 格式轉換為另一種格式。 基本上，您為轉換創建一個“樣式表”，然后使用xsltproc之類的應用程序進行轉換（教程：使用 xsltproc 進行 XSLT 處理）。
您可以在此處閱讀有關 XSL（XPath 等）的更多信息： XSLT 簡介。
更新
從給出的示例中，我有以下 XML、XSL 和 SVG 文檔。
XML 文檔（draw.xml）：
<?xml version="1.0" encoding="UTF-8"?>
<shapes name="mxgraph.aws4">
<shape aspect="fixed" h="47.651" name="backup" strokewidth="inherit" w="49.458">
<connections/>
<foreground>
<path>
<move x="24.731" y="0.045"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="21.02" x-axis-rotation="0" y="5.006"/>
<line x="6.458" y="15.131"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="1" x="6.456" x-axis-rotation="0" y="15.129"/>
<arc large-arc-flag="1" rx="4" ry="4" sweep-flag="0" x="4.337" x-axis-rotation="0" y="22.522"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="4.358" x-axis-rotation="0" y="22.522"/>
<line x="9.964" y="40.742"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="12.708" x-axis-rotation="0" y="47.651"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="16.589" x-axis-rotation="0" y="44.6"/>
<line x="33.206" y="44.6"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="37.087" x-axis-rotation="0" y="47.651"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="41.087" x-axis-rotation="0" y="43.651"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="39.749" x-axis-rotation="0" y="40.668"/>
<line x="45.235" y="22.51"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="45.458" x-axis-rotation="0" y="22.522"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="49.458" x-axis-rotation="0" y="18.522"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="43.36" x-axis-rotation="0" y="15.117"/>
<line x="28.796" y="4.922"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="28.897" x-axis-rotation="0" y="4.041"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="24.731" x-axis-rotation="0" y="0.045"/>
<close/>
<move x="24.897" y="1.951"/>
<arc large-arc-flag="0" rx="2.06" ry="2.06" sweep-flag="1" x="26.958" x-axis-rotation="0" y="4.01"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="24.897" x-axis-rotation="0" y="1.951"/>
<close/>
<move x="27.88" y="6.7"/>
<line x="41.973" y="16.563"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="41.538" x-axis-rotation="0" y="19.295"/>
<line x="36.692" y="21.373"/>
<line x="37.472" y="23.194"/>
<line x="42.391" y="21.084"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="43.343" x-axis-rotation="0" y="21.91"/>
<line x="37.952" y="39.75"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="35.774" x-axis-rotation="0" y="39.873"/>
<line x="33.337" y="36.215"/>
<line x="31.69" y="37.313"/>
<line x="34.126" y="40.965"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="33.227" x-axis-rotation="0" y="42.621"/>
<line x="16.567" y="42.621"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="15.665" x-axis-rotation="0" y="40.961"/>
<line x="18.097" y="37.313"/>
<line x="16.448" y="36.215"/>
<line x="14.009" y="39.873"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="11.737" x-axis-rotation="0" y="39.772"/>
<line x="6.274" y="22.016"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="7.405" x-axis-rotation="0" y="21.086"/>
<line x="12.319" y="23.194"/>
<line x="13.1" y="21.373"/>
<line x="8.259" y="19.297"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="8.337" x-axis-rotation="0" y="18.522"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="7.835" x-axis-rotation="0" y="16.582"/>
<line x="21.966" y="6.758"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="23.907" x-axis-rotation="0" y="7.91"/>
<line x="23.907" y="12.381"/>
<line x="25.888" y="12.381"/>
<line x="25.888" y="7.912"/>
<arc large-arc-flag="0" rx="4" ry="4" sweep-flag="0" x="27.88" x-axis-rotation="0" y="6.7"/>
<close/>
<move x="24.593" y="15.366"/>
<arc large-arc-flag="0" rx="10.24" ry="10.24" sweep-flag="0" x="17.807" x-axis-rotation="0" y="18.246"/>
<line x="17.698" y="16.701"/>
<line x="15.698" y="16.84"/>
<line x="15.977" y="20.641"/>
<arc large-arc-flag="0" rx="1" ry="1" sweep-flag="0" x="16.977" x-axis-rotation="0" y="21.551"/>
<line x="17.048" y="21.59"/>
<line x="20.847" y="21.311"/>
<line x="20.698" y="19.311"/>
<line x="19.497" y="19.393"/>
<arc large-arc-flag="0" rx="8.26" ry="8.26" sweep-flag="1" x="29.837" x-axis-rotation="0" y="18.991"/>
<arc large-arc-flag="0" rx="8.25" ry="8.25" sweep-flag="1" x="31.528" x-axis-rotation="0" y="30.541"/>
<arc large-arc-flag="0" rx="8.26" ry="8.26" sweep-flag="1" x="19.977" x-axis-rotation="0" y="32.231"/>
<arc large-arc-flag="0" rx="8.15" ry="8.15" sweep-flag="1" x="16.657" x-axis-rotation="0" y="25.66"/>
<line x="14.657" y="25.66"/>
<arc large-arc-flag="0" rx="10.22" ry="10.22" sweep-flag="0" x="24.887" x-axis-rotation="0" y="35.82"/>
<line x="24.897" y="35.84"/>
<arc large-arc-flag="1" rx="10.24" ry="10.24" sweep-flag="0" x="24.593" x-axis-rotation="0" y="15.366"/>
<close/>
<move x="4.337" y="16.42"/>
<arc large-arc-flag="0" rx="2.06" ry="2.06" sweep-flag="1" x="6.337" x-axis-rotation="0" y="18.481"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="4.337" x-axis-rotation="0" y="16.42"/>
<close/>
<move x="45.458" y="16.42"/>
<arc large-arc-flag="0" rx="2.06" ry="2.06" sweep-flag="1" x="47.516" x-axis-rotation="0" y="18.481"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="45.458" x-axis-rotation="0" y="16.42"/>
<close/>
<move x="12.708" y="41.561"/>
<arc large-arc-flag="0" rx="2.05" ry="2.05" sweep-flag="1" x="14.766" x-axis-rotation="0" y="43.561"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="12.708" x-axis-rotation="0" y="41.561"/>
<close/>
<move x="37.087" y="41.561"/>
<arc large-arc-flag="0" rx="2.05" ry="2.05" sweep-flag="1" x="39.138" x-axis-rotation="0" y="43.561"/>
<arc large-arc-flag="1" rx="2.06" ry="2.06" sweep-flag="1" x="37.087" x-axis-rotation="0" y="41.561"/>
<close/>
</path>
<fill/>
</foreground>
</shape>
</shapes>
XSL 文檔 (convert.xsl)：
<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/2000/svg">
<xsl:template match="/">
<xsl:apply-templates />
</xsl:template>
<xsl:template match="shapes">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50">
<xsl:apply-templates />
</svg>
</xsl:template>
<xsl:template match="shape">
<g id="{@name}">
<xsl:apply-templates />
</g>
</xsl:template>
<xsl:template match="path">
<path>
<xsl:attribute name="d">
<xsl:apply-templates />
</xsl:attribute>
</path>
</xsl:template>
<xsl:template match="move">
<xsl:text>M </xsl:text>
<xsl:value-of select="@x"/>
<xsl:text> </xsl:text>
<xsl:value-of select="@y"/>
</xsl:template>
<xsl:template match="line">
<xsl:text>L </xsl:text>
<xsl:value-of select="@x"/>
<xsl:text> </xsl:text>
<xsl:value-of select="@y"/>
</xsl:template>
<xsl:template match="arc">
<xsl:text>A </xsl:text>
<xsl:value-of select="@rx"/>
<xsl:text> </xsl:text>
<xsl:value-of select="@ry"/>
<xsl:text> </xsl:text>
<xsl:value-of select="@x-axis-rotation"/>
<xsl:text> </xsl:text>
<xsl:value-of select="@large-arc-flag"/>
<xsl:text> </xsl:text>
<xsl:value-of select="@sweep-flag"/>
<xsl:text> </xsl:text>
<xsl:value-of select="@x"/>
<xsl:text> </xsl:text>
<xsl:value-of select="@y"/>
</xsl:template>
<xsl:template match="text()">
</xsl:template>
</xsl:stylesheet>
應用命令：
xsltproc -o draw.svg convert.xsl draw.xml
我生成以下 SVG 文檔。
SVG 文檔（draw.svg）：
<?xml version="1.0"?> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50"> <g id="backup"> <path d="M 24.731 0.045A 4 4 0 0 0 21.02 5.006L 6.458 15.131A 4 4 0 0 1 6.456 15.129A 4 4 0 1 0 4.337 22.522A 4 4 0 0 0 4.358 22.522L 9.964 40.742A 4 4 0 0 0 12.708 47.651A 4 4 0 0 0 16.589 44.6L 33.206 44.6A 4 4 0 0 0 37.087 47.651A 4 4 0 0 0 41.087 43.651A 4 4 0 0 0 39.749 40.668L 45.235 22.51A 4 4 0 0 0 45.458 22.522A 4 4 0 0 0 49.458 18.522A 4 4 0 0 0 43.36 15.117L 28.796 4.922A 4 4 0 0 0 28.897 4.041A 4 4 0 0 0 24.731 0.045M 24.897 1.951A 2.06 2.06 0 0 1 26.958 4.01A 2.06 2.06 0 1 1 24.897 1.951M 27.88 6.7L 41.973 16.563A 4 4 0 0 0 41.538 19.295L 36.692 21.373L 37.472 23.194L 42.391 21.084A 4 4 0 0 0 43.343 21.91L 37.952 39.75A 4 4 0 0 0 35.774 39.873L 33.337 36.215L 31.69 37.313L 34.126 40.965A 4 4 0 0 0 33.227 42.621L 16.567 42.621A 4 4 0 0 0 15.665 40.961L 18.097 37.313L 16.448 36.215L 14.009 39.873A 4 4 0 0 0 11.737 39.772L 6.274 22.016A 4 4 0 0 0 7.405 21.086L 12.319 23.194L 13.1 21.373L 8.259 19.297A 4 4 0 0 0 8.337 18.522A 4 4 0 0 0 7.835 16.582L 21.966 6.758A 4 4 0 0 0 23.907 7.91L 23.907 12.381L 25.888 12.381L 25.888 7.912A 4 4 0 0 0 27.88 6.7M 24.593 15.366A 10.24 10.24 0 0 0 17.807 18.246L 17.698 16.701L 15.698 16.84L 15.977 20.641A 1 1 0 0 0 16.977 21.551L 17.048 21.59L 20.847 21.311L 20.698 19.311L 19.497 19.393A 8.26 8.26 0 0 1 29.837 18.991A 8.25 8.25 0 0 1 31.528 30.541A 8.26 8.26 0 0 1 19.977 32.231A 8.15 8.15 0 0 1 16.657 25.66L 14.657 25.66A 10.22 10.22 0 0 0 24.887 35.82L 24.897 35.84A 10.24 10.24 0 1 0 24.593 15.366M 4.337 16.42A 2.06 2.06 0 0 1 6.337 18.481A 2.06 2.06 0 1 1 4.337 16.42M 45.458 16.42A 2.06 2.06 0 0 1 47.516 18.481A 2.06 2.06 0 1 1 45.458 16.42M 12.708 41.561A 2.05 2.05 0 0 1 14.766 43.561A 2.06 2.06 0 1 1 12.708 41.561M 37.087 41.561A 2.05 2.05 0 0 1 39.138 43.561A 2.06 2.06 0 1 1 37.087 41.561"/> </g> </svg>
更新
轉換整個 AWS 文件會產生以下結果： https ://svgshare.com/i/hfn.svg。
解決方案3
1 已采納 2022-05-25 06:18:04
可以使用 XSLT 將一種 XML 格式轉換為另一種格式。 基本上，您為轉換創建一個“樣式表”，然后使用xsltproc或SAXON XSLT 處理器之類的應用程序進行轉換（教程：使用 xsltproc 進行 XSLT 處理）。
您可以在此處閱讀有關 XSL（XPath 等）的更多信息： XSLT 簡介。
在本例中，我將使用 Saxon 處理器，因為我需要 XSLT 2.0 中的一些函數（ XPath、XQuery 和 XSLT 函數參考）。 要求的部分是將<path>的d屬性的值轉換為元素。
從給出的示例中，我有以下 SVG、XSL 和 XML 文檔。
SVG 文檔：
<?xml version="1.0" encoding="UTF-8"?>
<svg width="48px" height="48px" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>Icon-Resource/Storage/Res_AWS-Backup_Backup-Vault_48_Dark</title>
<g id="Icon-Resource/Storage/Res_AWS-Backup_Backup-Vault_48" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M10.298,22.955 L8.298,22.969 C8.333,27.982 10.654,32.573 14.668,35.564 C17.503,37.677 20.819,38.696 24.109,38.696 C28.942,38.696 33.717,36.496 36.82,32.332 C42.036,25.334 40.587,15.396 33.589,10.18 C26.813,5.13 17.297,6.345 11.963,12.775 L12,10.014 L10,9.987 L9.933,14.987 C9.929,15.252 10.031,15.508 10.216,15.698 C10.402,15.888 10.654,15.997 10.919,16 L15.986,16.068 L16.014,14.068 L13.513,14.035 C18.176,8.43 26.479,7.376 32.394,11.783 C38.507,16.341 39.774,25.023 35.217,31.137 C30.658,37.251 21.979,38.517 15.863,33.96 C12.357,31.347 10.328,27.335 10.298,22.955 L10.298,22.955 Z M24,19 C21.794,19 20,20.795 20,23 C20,25.206 21.794,27 24,27 C26.206,27 28,25.206 28,23 C28,20.795 26.206,19 24,19 L24,19 Z M16.946,28.78 L19.175,26.552 C18.441,25.556 18,24.33 18,23 C18,21.622 18.473,20.353 19.257,19.339 L16.947,17.191 L18.309,15.727 L20.729,17.977 C21.671,17.362 22.793,17 24,17 C25.342,17 26.577,17.448 27.577,18.195 L29.982,15.726 L31.414,17.121 L28.965,19.636 C29.617,20.597 30,21.754 30,23 C30,24.252 29.613,25.415 28.955,26.377 L31.414,28.756 L30.024,30.194 L27.565,27.815 C26.567,28.556 25.336,29 24,29 C22.742,29 21.574,28.61 20.61,27.946 L18.361,30.194 L16.946,28.78 Z M35,44 L39,44 L39,43 L35,43 L35,44 Z M9,44 L13,44 L13,43 L9,43 L9,44 Z M46,3 L46,42 C46,42.553 45.553,43 45,43 L41,43 L41,45 C41,45.553 40.553,46 40,46 L34,46 C33.447,46 33,45.553 33,45 L33,43 L15,43 L15,45 C15,45.553 14.553,46 14,46 L8,46 C7.447,46 7,45.553 7,45 L7,43 L3,43 C2.447,43 2,42.553 2,42 L2,33 L4,33 L4,41 L44,41 L44,4 L4,4 L4,11 L2,11 L2,3 C2,2.448 2.447,2 3,2 L45,2 C45.553,2 46,2.448 46,3 L46,3 Z M2,27 L4,27 L4,17 L2,17 L2,27 Z" id="Fill-1" fill="#6CAE3E"></path>
</g>
</svg>
XSL 文檔：
<?xml version="1.0"?>
<xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:svg="http://www.w3.org/2000/svg" exclude-result-prefixes="svg">
<xsl:output method="xml" version="1.0" encoding="UTF-8" indent="yes"/>
<xsl:template match="/">
<xsl:apply-templates />
</xsl:template>
<xsl:template match="svg:svg">
<shapes name="mxgraph.aws4">
<shape aspect="fixed" h="{replace(@height, 'px', '')}"
name="{svg:title}" strokewidth="inherit" w="{replace(@width, 'px', '')}">
<connections/>
<foreground>
<xsl:apply-templates />
</foreground>
</shape>
</shapes>
</xsl:template>
<xsl:template match="svg:g">
<xsl:apply-templates />
</xsl:template>
<xsl:template match="svg:path">
<xsl:variable name="d1" select="replace(@d,'M','*M')"/>
<xsl:variable name="d2" select="replace($d1,'L','*L')"/>
<xsl:variable name="d3" select="replace($d2,'A','*A')"/>
<xsl:variable name="d4" select="replace($d3,'C','*C')"/>
<xsl:variable name="d5" select="replace($d4,'Z','*Z')"/>
<xsl:variable name="d" select="tokenize($d5,'\*+')"/>
<xsl:for-each select="$d">
<xsl:variable name="comkey" select="substring(.,1,1)"/>
<xsl:variable name="comline" select="normalize-space(substring(.,2))"/>
<xsl:choose>
<xsl:when test="$comkey = 'M'">
<xsl:variable name="comlinespace" select="tokenize(replace($comline,',', ' '),' ')"/>
<move x="{$comlinespace[1]}" y="{$comlinespace[2]}"/>
</xsl:when>
<xsl:when test="$comkey = 'L'">
<xsl:variable name="comlinespace" select="tokenize(replace($comline,',', ' '),' ')"/>
<line x="{$comlinespace[1]}" y="{$comlinespace[2]}"/>
</xsl:when>
<xsl:when test="$comkey = 'A'">
<xsl:variable name="comlinespace" select="tokenize(replace($comline,',', ' '),' ')"/>
<arc rx="{$comlinespace[1]}" ry="{$comlinespace[2]}"
x-axis-rotation="{$comlinespace[3]}"
large-arc-flag="{$comlinespace[4]}"
sweep-flag="{$comlinespace[5]}"
x="{$comlinespace[6]}" y="{$comlinespace[7]}"/>
</xsl:when>
<xsl:when test="$comkey = 'C'">
<xsl:variable name="comlinespace" select="tokenize($comline,' ')"/>
<curve>
<xsl:for-each select="$comlinespace">
<xsl:variable name="points" select="tokenize(.,',')"/>
<xsl:attribute name="x{position()}">
<xsl:value-of select="$points[1]"/>
</xsl:attribute>
<xsl:attribute name="y{position()}">
<xsl:value-of select="$points[2]"/>
</xsl:attribute>
</xsl:for-each>
</curve>
</xsl:when>
<xsl:when test="$comkey = 'Z'">
<close/>
</xsl:when>
</xsl:choose>
</xsl:for-each>
</xsl:template>
<xsl:template match="text()"></xsl:template>
</xsl:stylesheet>
應用命令：
saxonb-xslt -o svgaws.xml svg.svg convert.xsl
我生成以下 XML 文檔。
XML 文檔：
<?xml version="1.0" encoding="UTF-8"?>
<shapes name="mxgraph.aws4">
<shape aspect="fixed" h="48"
name="Icon-Resource/Storage/Res_AWS-Backup_Backup-Vault_48_Dark"
strokewidth="inherit"
w="48px">
<connections/>
<foreground>
<move x="10.298" y="22.955"/>
<line x="8.298" y="22.969"/>
<curve x1="8.333" y1="27.982" x2="10.654" y2="32.573" x3="14.668" y3="35.564"/>
<curve x1="17.503" y1="37.677" x2="20.819" y2="38.696" x3="24.109" y3="38.696"/>
<curve x1="28.942" y1="38.696" x2="33.717" y2="36.496" x3="36.82" y3="32.332"/>
<curve x1="42.036" y1="25.334" x2="40.587" y2="15.396" x3="33.589" y3="10.18"/>
<curve x1="26.813" y1="5.13" x2="17.297" y2="6.345" x3="11.963" y3="12.775"/>
<line x="12" y="10.014"/>
<line x="10" y="9.987"/>
<line x="9.933" y="14.987"/>
<curve x1="9.929" y1="15.252" x2="10.031" y2="15.508" x3="10.216" y3="15.698"/>
<curve x1="10.402" y1="15.888" x2="10.654" y2="15.997" x3="10.919" y3="16"/>
<line x="15.986" y="16.068"/>
<line x="16.014" y="14.068"/>
<line x="13.513" y="14.035"/>
<curve x1="18.176" y1="8.43" x2="26.479" y2="7.376" x3="32.394" y3="11.783"/>
<curve x1="38.507" y1="16.341" x2="39.774" y2="25.023" x3="35.217" y3="31.137"/>
<curve x1="30.658" y1="37.251" x2="21.979" y2="38.517" x3="15.863" y3="33.96"/>
<curve x1="12.357" y1="31.347" x2="10.328" y2="27.335" x3="10.298" y3="22.955"/>
<line x="10.298" y="22.955"/>
<close/>
<move x="24" y="19"/>
<curve x1="21.794" y1="19" x2="20" y2="20.795" x3="20" y3="23"/>
<curve x1="20" y1="25.206" x2="21.794" y2="27" x3="24" y3="27"/>
<curve x1="26.206" y1="27" x2="28" y2="25.206" x3="28" y3="23"/>
<curve x1="28" y1="20.795" x2="26.206" y2="19" x3="24" y3="19"/>
<line x="24" y="19"/>
<close/>
<move x="16.946" y="28.78"/>
<line x="19.175" y="26.552"/>
<curve x1="18.441" y1="25.556" x2="18" y2="24.33" x3="18" y3="23"/>
<curve x1="18" y1="21.622" x2="18.473" y2="20.353" x3="19.257" y3="19.339"/>
<line x="16.947" y="17.191"/>
<line x="18.309" y="15.727"/>
<line x="20.729" y="17.977"/>
<curve x1="21.671" y1="17.362" x2="22.793" y2="17" x3="24" y3="17"/>
<curve x1="25.342" y1="17" x2="26.577" y2="17.448" x3="27.577" y3="18.195"/>
<line x="29.982" y="15.726"/>
<line x="31.414" y="17.121"/>
<line x="28.965" y="19.636"/>
<curve x1="29.617" y1="20.597" x2="30" y2="21.754" x3="30" y3="23"/>
<curve x1="30" y1="24.252" x2="29.613" y2="25.415" x3="28.955" y3="26.377"/>
<line x="31.414" y="28.756"/>
<line x="30.024" y="30.194"/>
<line x="27.565" y="27.815"/>
<curve x1="26.567" y1="28.556" x2="25.336" y2="29" x3="24" y3="29"/>
<curve x1="22.742" y1="29" x2="21.574" y2="28.61" x3="20.61" y3="27.946"/>
<line x="18.361" y="30.194"/>
<line x="16.946" y="28.78"/>
<close/>
<move x="35" y="44"/>
<line x="39" y="44"/>
<line x="39" y="43"/>
<line x="35" y="43"/>
<line x="35" y="44"/>
<close/>
<move x="9" y="44"/>
<line x="13" y="44"/>
<line x="13" y="43"/>
<line x="9" y="43"/>
<line x="9" y="44"/>
<close/>
<move x="46" y="3"/>
<line x="46" y="42"/>
<curve x1="46" y1="42.553" x2="45.553" y2="43" x3="45" y3="43"/>
<line x="41" y="43"/>
<line x="41" y="45"/>
<curve x1="41" y1="45.553" x2="40.553" y2="46" x3="40" y3="46"/>
<line x="34" y="46"/>
<curve x1="33.447" y1="46" x2="33" y2="45.553" x3="33" y3="45"/>
<line x="33" y="43"/>
<line x="15" y="43"/>
<line x="15" y="45"/>
<curve x1="15" y1="45.553" x2="14.553" y2="46" x3="14" y3="46"/>
<line x="8" y="46"/>
<curve x1="7.447" y1="46" x2="7" y2="45.553" x3="7" y3="45"/>
<line x="7" y="43"/>
<line x="3" y="43"/>
<curve x1="2.447" y1="43" x2="2" y2="42.553" x3="2" y3="42"/>
<line x="2" y="33"/>
<line x="4" y="33"/>
<line x="4" y="41"/>
<line x="44" y="41"/>
<line x="44" y="4"/>
<line x="4" y="4"/>
<line x="4" y="11"/>
<line x="2" y="11"/>
<line x="2" y="3"/>
<curve x1="2" y1="2.448" x2="2.447" y2="2" x3="3" y3="2"/>
<line x="45" y="2"/>
<curve x1="45.553" y1="2" x2="46" y2="2.448" x3="46" y3="3"/>
<line x="46" y="3"/>
<close/>
<move x="2" y="27"/>
<line x="4" y="27"/>
<line x="4" y="17"/>
<line x="2" y="17"/>
<line x="2" y="27"/>
<close/>
</foreground>
</shape>
</shapes>
從 SVG 文件到 XML 文件的轉換
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.