如何解释 XML 文件中包含图形信息的部分？答案

【问题标题】：How to interprete a section in XML file containing graphical information?如何解释 XML 文件中包含图形信息的部分？
【发布时间】：2021-12-26 05:49:15
【问题描述】：

我尝试解释使用diagrams.net 创建的图表的 XML 文件。所有图形元素都可以轻松读取，但手绘工具的编码不可读。虽然我选择保存而不压缩这部分可能会以压缩格式保存吗？有一个明显随机的字母、数字和一些特殊字符（+、/、=）序列来描述这里看到的短笔划：

笔画编码从stencil(之后的第二行开始（完整代码见here）。

笔画在这个序列中是如何编码的？

<mxCell id="c7RGBG_HR7ZXm5QX32jH-9" value="" style="shape=
stencil(lZTdboMwDIWfhlsrsZM4ue6696hUOtAYVJTu5+1nFG0jSPOWu2DOF/s4lhs63Lr
TtW3Q3JZ5em7f+vPSNfTQIPZj1879IqeGjg0dLtPcPs3TfTzn7+tpVa6nl+l1veE9cwaMWSE0Hzlgz
XfoMQNDP24ACxarAA/RFkAMEFhJQGBSAbAFRwoQAEsPQc8gHogLwEcgJQMy+NKDE1cKQATJFYBEtA
zOAMcCkL5pXXUMWJZkddMe9x6sRLR3E9OlB71JQa4ru+rAKgUFBhcKvT5HMgWcavQeUqzRpy97/9NHB
KypP8qDVukZ2Nbo037mdH1CMFV6AsYavQf0NfqwH9A/9NIfrtFHiDXzsNlrvwFy+N
mrl34Y8lre/t/vYQnlHU7HTw==);
fillColor=none;" vertex="1" parent="1"> <mxGeometry x="277.5999755859375"
y="238.19998168945312" width="71.60000610351562" height="2.399993896484375" 
as="geometry" />  </mxCell>

如果我将其保存为 SVG 文件，则坐标是可读的 (full SVG code)。

path d="M -0.4 2.6 L 0.4 2.6 L 3.76 2.28 L 8.97 1.91 L 11.2 1.8 L 14.9 1.6 L 19.3 1.3 L 23.9 1 L 28.8 0.8 L 33.4 0.6 L 37.2 0.5 L 40.8 0.4 L 44.4 0.3 L 47.9 0.2 L 51 0.2 L 54 0.2 L 56.4 0.2 L 58.5 0.2 L 60.5 0.2 L 62.4 0.2 L 64 0.2 L 65.5 0.2 L 66.7 0.2 L 67.8 0.2 L 68.7 0.2 L 69.6 0.2 L 70.4 0.2 L 71.2 0.2"

手绘工具可以在菜单排列->插入->手绘中找到。 XML 在 Menu File->Export as->XML 中保存而不压缩。

【问题讨论】：

标签： xml diagram

【解决方案1】：

原始文本经过 Base64 编码，然后通过 deflate 和 URL 编码进行压缩。原文可以通过以下方式重构：

Base64 解码
充气
网址解码

这里有一个转换工具和描述：

https://j2r2b.github.io/2019/08/01/drawio-decompressed-xml.html

Python 3. 代码

import base64,zlib,urllib
decoded_text=urllib.parse.unquote(zlib.decompress(base64.b64decode(encoded_text),wbits=-15))

OP的压缩代码是

lZTdboMwDIWfhlsrsZM4ue6696hUOtAYVJTu5+1nFG0jSPOWu2DOF/s4lhs63Lr
TtW3Q3JZ5em7f+vPSNfTQIPZj1879IqeGjg0dLtPcPs3TfTzn7+tpVa6nl+l1ve
E9cwaMWSE0HzlgzXfoMQNDP24ACxarAA/RFkAMEFhJQGBSAbAFRwoQAEsPQc8gH
ogLwEcgJQMy+NKDE1cKQATJFYBEtAzOAMcCkL5pXXUMWJZkddMe9x6sRLR3E9Ol
B71JQa4ru+rAKgUFBhcKvT5HMgWcavQeUqzRpy97/9NHBKypP8qDVukZ2Nbo037
mdH1CMFV6AsYavQf0NfqwH9A/9NIfrtFHiDXzsNlrvwFy+Nmrl34Y8lre/t/vYQ
nlHU7HTw==

转换后（使用工具或python）：

<shape strokewidth="inherit"><foreground><path><move x="0.00"
y="100.00"/><line x="1.12" y="100.00"/><line x="5.81" y="86.67"/>
<line x="13.09" y="71.43"/><line x="16.20" y="66.67"/><line x="21.37"
 y="58.33"/><line x="27.51" y="45.83"/><line x="33.94" y="33.33"/>
<line x="40.78" y="25.00"/><line x="47.21" y="16.67"/><line x="52.51"
 y="12.50"/><line x="57.54" y="8.33"/><line x="62.57" y="4.17"/>
<line x="67.46" y="0.00"/><line x="71.79" y="0.00"/><line x="75.98"
 y="0.00"/><line x="79.33" y="0.00"/><line x="82.26" y="0.00"/>
<line x="85.06" y="0.00"/><line x="87.71" y="0.00"/><line x="89.94"
 y="0.00"/><line x="92.04" y="0.00"/><line x="93.72" y="0.00"/>
<line x="95.25" y="0.00"/><line x="96.51" y="0.00"/><line x="97.77"
 y="0.00"/><line x="98.88" y="0.00"/><line x="100.00" y="0.00"/>
</path><fillstroke/></foreground></shape>

【讨论】：