我是 XSLT 和 SVG 的新手,并且已经做了很多研究。我在这里看到了一些答案,这些答案看起来很接近我需要帮助的内容,但对我来说并不完全有效。任何帮助,将不胜感激。
我正在从 SQL 数据库中提取一个 XML 文件,如下所示:
<Report>
<Title>Step Status Sums Report</Title>
<RESULTS>
<ROW>
<PASSED>2784</PASSED>
<FAILED>73</FAILED>
<CAUTION>29</CAUTION>
<BLOCKED>27</BLOCKED>
<NOTRUN>3776</NOTRUN>
</ROW>
</RESULTS>
</Report>
Run Code Online (Sandbox Code Playgroud)
通过在线项目管理工具,我只能使用 xslt 1.0 版和 SVG 转换这些数据。
我想要的是:一个简单的条形图(顺便说一下,这个数据会随着不同的项目而改变——所以不一定是这个特定的数据)。
这是我尝试过的,我知道这可能看起来像一个糟糕的结构,因为我正在尝试关注网上看起来相似的东西。
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl"
xmlns="http://www.w3.org/2000/svg">
<xsl:output method="xml" indent="yes"/>
<xsl:template match="/RESULTS">
<svg width="650" height="500">
<g id="axis" transform="translate(0 500) scale(1 -1)">
<line id="axis-y" x1="30" y1="20" x2="30" y2="450" style="fill:none;stroke:rgb(0,0,0);stroke-width:2"/>
<line id="axis-x" x1="30" y1="20" x2="460" y2="20" style="fill:none;stroke:rgb(0,0,0);stroke-width:2"/>
</g>
<xsl:for-each select="ROW">
<g id="bars" transform="translate(30 479) scale(1 -430)"> …Run Code Online (Sandbox Code Playgroud)