XSL调用变量生成SVG饼图失败，页面空白求助

针对你在XSL生成SVG饼图时，嵌入变量到stroke-dasharray导致页面空白的问题，核心原因大概率是变量输出格式不匹配SVG属性要求，或者XSLT表达式的语法/逻辑错误，以下是具体排查点和解决方法：

1. 确保变量输出为纯数值，无多余字符 #

SVG的stroke-dasharray要求值为以逗号或空格分隔的纯数字，如果你的变量输出带有空格、单位（如px）、XML实体或引号，会直接导致SVG渲染失效。

解决方法：
使用number()函数强制转换变量为数值类型，过滤非数值内容：

<circle 
  stroke-dasharray="{number($allCrits)}, {number($allOK)}, {number($allWarning)}"
  stroke-width="100"
  r="50"
  ...
/>

2. 匹配饼图周长的比例计算 #

静态SVG正常是因为你写的是对应圆周长的数值，但直接用原始数据（allCrits等）的话，数值总和allHits不一定等于圆的周长（周长公式：2 * π * r），导致stroke-dasharray的分段长度与实际图形不匹配，最终无法显示。

解决方法：
将原始数据按比例转换为对应周长的长度：

<!-- 先定义周长变量 -->
<xsl:variable name="circleCircumference" select="2 * 3.1416 * 50"/> <!-- r=50的情况 -->
<circle 
  stroke-dasharray="
    {($allCrits div $allHits) * $circleCircumference}, 
    {($allOK div $allHits) * $circleCircumference}, 
    {($allWarning div $allHits) * $circleCircumference}
  "
  ...
/>

注意：XSLT中除法要用div，不能用/（/是节点选择运算符，会导致非数值输出）。

3. 检查XSL属性模板的语法正确性 #

确认变量嵌入的大括号{}没有遗漏或嵌套错误，比如如果表达式里有复杂计算，要确保括号配对正确：
错误示例：{$allCrits / $allHits * $circleCircumference}（用了/而非div）
正确示例：{($allCrits div $allHits) * $circleCircumference}

4. 验证生成的SVG代码 #

先单独查看XSL转换后的HTML中，SVG的stroke-dasharray实际输出值是什么：

• 用浏览器开发者工具查看SVG元素的属性，确认数值格式是否正确
• 将该数值手动替换到静态SVG中测试，如果能显示，说明是XSL变量输出的问题；如果还是空白，检查SVG的其他属性（如stroke-width、transform、viewBox）是否正确

5. 适配XSL-FO的SVG支持 #

因为后续要转PDF，XSL-FO对SVG的支持有一定限制：

• 必须给SVG元素添加正确的命名空间：<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" ...>
• 避免使用XSL-FO不支持的SVG属性，比如某些CSS样式写法

内容的提问来源于stack exchange，提问作者Alex