标题：Bug：renderSVG 忽略内联 font-size 样式，默认字体大小为 12px

[subhanshu-shukla-ril]

描述
使用 DiagramViewer.renderSVG() 渲染 Draw.io 图时，图元中嵌套的 HTML 字体大小样式（如 font-size: 5px;）被忽略，渲染出来的 SVG 字体大小强制为 12px，导致与原图不一致。

SVG 应该根据 XML 内容中指定的 font-size 渲染文字，例如以下内容：

<font style="font-size: 5px;"><b>Customer</b></font>
应被渲染为字体大小 5px。

❌ 实际行为
渲染后的 SVG 中外部容器强制使用 font-size: 12px，覆盖了内联样式，最终显示出来的字体为 12px 而不是预期的 5px。

✅ 预期行为

<svg xmlns="http://www.w3.org/2000/svg" style="background: #ffffff; background-color: light-dark(#ffffff, #121212);" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="42" height="62" viewBox="-0.5 -0.5 42 62" content="&lt;mxfile&gt;&lt;diagram id=&quot;C5RBs43oDa-KdzZeNtuy&quot; name=&quot;Page-1&quot;&gt;xZRtb4IwEMc/DS9NtBWmLzd0uucsbprsXYUKzQrFUgT36XfYIqJuziXLMCHn76537Z+7WtiNipEkSfggfMot1PYLCw8shGy7A+8SrDVwHKRBIJmvUbsGE/ZBTZyBGfNpqpHJpITgiiVN6Ik4pp5qMCKlyJthC8H9BkhIQA/AxCP8kM6Yr0JDO06/dowpC0JTuocutGNOvPdAiiw29SyEF5tHuyNS5TKnT0Pii3ynKB5a2JVCKG1FhUt5qWyl2uxmPeP3787o9jldkteru5fHaUsnuz5nyfaEksbq16lV2p3edm+m2VPg9d96/ftlMm51bJ17RXhGKxkcDlWufLYCMyjNCs0PgNwnUP8gCtiRZP+QfyFAP/iQam2ax1lmonK00k1nX0KAnRR6lXF/uU83S5WIqDyxO133+02jxsbQpi9p+ek64M5DpugkIV7pzWGKgYUq4sb9w/4wfbSiUtFiv4/hdqBwFCXXELK9GvQKczFgMwh5PWYVCncGzDaMmMEOtnnr7gTDNOgZzYp6R5p1TzcY0qQ0iaeEPK3cgnHuCl6GwmrcHZS/P1TUaZ9SFB1RFJ+vKPytb6aNb+fyx8NP&lt;/diagram&gt;&lt;/mxfile&gt;"><defs><filter id="drawio-drop-shadow"><feGaussianBlur in="SourceAlpha" stdDeviation="1.7" result="blur"/><feOffset in="blur" dx="3" dy="3" result="offsetBlur"/><feFlood flood-color="#3D4574" flood-opacity="0.4" result="offsetColor"/><feComposite in="offsetColor" in2="offsetBlur" operator="in" result="offsetBlur"/><feBlend in="SourceGraphic" in2="offsetBlur"/></filter></defs><rect fill="#ffffff" width="100%" height="100%" x="0" y="0" style="fill: light-dark(rgb(255, 255, 255), rgb(18, 18, 18));"/><g filter="url(#drawio-drop-shadow)"><g><rect x="0" y="0" width="30" height="50" rx="4.5" ry="4.5" fill="#ffffff" stroke="#000000" pointer-events="all" style="fill: light-dark(#ffffff, var(--ge-dark-color, #121212)); stroke: light-dark(rgb(0, 0, 0), rgb(255, 255, 255));"/></g><g><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 28px; height: 1px; padding-top: 25px; margin-left: 1px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; color: #000000; "><div style="display: inline-block; font-size: 12px; font-family: &quot;Helvetica&quot;; color: light-dark(#000000, #ffffff); line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><div><b><br /></b></div><div><b><br /></b></div><div><font style="font-size: 5px;"><b>Customer</b></font></div></div></div></div></foreignObject><text x="15" y="29" fill="light-dark(#000000, #ffffff)" font-family="&quot;Helvetica&quot;" font-size="12px" text-anchor="middle">Custo...</text></switch></g></g><g><path d="M 5 30 C 5 18 5 12 15 12 C 8.33 12 8.33 0 15 0 C 21.67 0 21.67 12 15 12 C 25 12 25 18 25 30 Z" fill="#4d4d4d" stroke="#000000" stroke-miterlimit="10" pointer-events="all" style="fill: light-dark(rgb(77, 77, 77), rgb(171, 171, 171)); stroke: light-dark(rgb(0, 0, 0), rgb(255, 255, 255));"/></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.drawio.com/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display`

❌ 实际行为
渲染后的 SVG 中外部容器强制使用 font-size: 12px，覆盖了内联样式，最终显示出来的字体为 12px 而不是预期的 5px。

实际 SVG 代码片段：

<svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="33px" height="53px" viewBox="-0.5 -0.5 33 53"><defs></defs><g><rect x="1" y="1" width="30" height="50" rx="4.5" ry="4.5" fill="#ffffff" stroke="#000000" pointer-events="all"></rect><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 28px; height: 1px; padding-top: 26px; margin-left: 2px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><div><b><br></b></div><div><b><br></b></div><div><b>Customer</b></div></div></div></div></foreignObject><text x="16" y="30" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">Custo...</text></switch></g><path d="M 6 31 C 6 19 6 13 16 13 C 9.33 13 9.33 1 16 1 C 22.67 1 22.67 13 16 13 C 26 13 26 19 26 31 Z" fill="#4d4d4d" stroke="#000000" stroke-miterlimit="10" pointer-events="all"></path></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"></g><a transform="translate(0,-5)" xlink:href="https://desk.draw.io/support/solutions/articles/16000042487" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Viewer does not support full SVG 1.1</text></a></switch></svg>

🧪 重现步骤
使用以下 XML 创建一个 Draw.io 图：

<mxGraphModel>
  <root>
    <mxCell id="0"/>
    <mxCell id="1" parent="0"/>
    <mxCell id="15"
      value="&lt;div&gt;&lt;font style=&quot;font-size: 5px;&quot;&gt;&lt;b&gt;Customer&lt;/b&gt;&lt;/font&gt;&lt;/div&gt;"
      style="rounded=1;whiteSpace=wrap;html=1;" parent="1" vertex="1">
      <mxGeometry x="55" y="30" width="30" height="50" as="geometry"/>
    </mxCell>
  </root>
</mxGraphModel>

使用以下代码渲染：

 import { DiagramViewer } from 'embed-drawio/dist/es/core/viewer';
const viewer = new DiagramViewer(stringToXml(xml));
const svg = viewer.renderSVG(null, 1, 1);

检查生成的 SVG，字体大小为 12px。

环境信息
包名：embed-drawio

时间：2025年6月

使用场景：网页 / React 应用

🔧 建议修复方向
请确保渲染 SVG 时保留嵌套的 font-size 样式，而不是在外层容器上强制覆盖为 12px。理想行为是让 SVG 中的文字样式保持与原始 draw.io 文件一致。

如需，我可以帮你 直接在 GitHub 上创建 issue 或 生成该问题的 Markdown 文件。你希望哪种方式？

[subhanshu-shukla-ril]

有什么进展吗？

[WindRunnerMax]

可以提个 pr

[subhanshu-shukla-ril]

当然，如果你愿意提交 PR，我可以为你建议修复方法。以下是修复建议和中文说明：