数据栏通过样式表转换?

时间:2013-09-25 20:15:24

标签: xslt

我有一些XML格式的数据。对于示例

<?xml version="1.0"?>
<TableSizes>
   <Table name="AuditLog" rows="13193925" reserved="4896864" data="2522592" indexSize="2373824" unused="448"/>
   <Table name="Customers" rows="7021839" reserved="3243392" data="1480640" indexSize="1762640" unused="112"/>
</TableSizes>

我希望客户能够转换和显示这些数据。因此,当我向用户代理提供xml时,我提供了一个样式表:

<?xml version="1.0"?>
<?xml-stylesheet type='text/xsl' href='databaseSize.xslt' media='all'?>
<TableSizes>
   <Table name="AuditLog" rows="13193925" reserved="4896864" data="2522592" indexSize="2373824" unused="448"/>
   <Table name="Customers" rows="7021839" reserved="3243392" data="1480640" indexSize="1762640" unused="112"/>
</TableSizes>

这会导致它转换为一些合适的HTML。这很有效。

但现在我想添加数据栏

就像现在一样,我一直在服务器上生成HTML(即服务器决定如何显示内容,而不是样式表):

enter image description here

这要求每个表格单元格都应用自定义background样式,计算出的渐变停止:

<TR>
    <TD>AuditLog
    <TD style="background: linear-gradient(to right, #658FC6 0%,rgb(255,255,255) 100%,rgb(255,255,255) 100%)">1319,,3925
    <TD style="background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 100%,rgb(255,255,255) 100%)">489,,6864
    <TD>252,,2592
    <TD>237,,3824
    <TD>448
</TR>
<TR>
    <TD>Customers
    <TD style="background: linear-gradient(to right, #658FC6 0%,rgb(255,255,255) 51%,rgb(255,255,255) 100%)">702,,1839
    <TD style="background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 62%,rgb(255,255,255) 100%)">324,,3392
    <TD>148,,0640
    <TD>176,,2640
    <TD>112
</TR>

显然,我宁愿通过样式表在客户端中执行所有这些操作,而不是在服务器上执行。

可能的?

注意:如果不是:这不是问题;就这么说吧。

到目前为止我的XSLT是什么?

基本上没有。到目前为止,XST没有添加任何数据栏:

<TD><xsl:value-of select="@name"/>
<TD><xsl:value-of select="@rows"/>
<TD><xsl:value-of select="@reserved"/>
<TD><xsl:value-of select="@data"/>
<TD><xsl:value-of select="@indexSize"/>
<TD><xsl:value-of select="@unused"/>

我添加了一定数量的渐变绘图代码:

<TD><xsl:value-of select="@name"/>
<TD style='background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 50%,rgb(255,255,255) 100%)'><xsl:value-of select="@rows"/>
<TD style='background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 50%,rgb(255,255,255) 100%)'><xsl:value-of select="@reserved"/>
<TD><xsl:value-of select="@data"/>
<TD><xsl:value-of select="@indexSize"/>
<TD><xsl:value-of select="@unused"/>

严格来说,我甚至没有那个XSLT。当我无法完成我想要的东西时,我不想写一个完整的XSLT。我上面的XSLT是我在飞行中创建的,当有人提出问题不能解决时,直到我至少假装首先有一些XSLT。

1 个答案:

答案 0 :(得分:0)

您可以在XSLT中轻松完成计算并将其放入样式属性中。

我为每个AuditLogCustomers创建了一个模板。然后在Customers模板中,我刚刚为AuditLog中的先前值定义了一个变量,以便在计算中使用。从那里我用它们来计算渐变所需的百分比(以及一些快速'舍入')。

<xsl:value-of select="substring(((@rows div $PrevRow) * 100),1,2)"/>

因此,当您使用XML并使用此XSL转换它时

<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:output method="xml" indent="yes" />

  <xsl:template match="Table[@name='AuditLog']">
    <tr>
      <td>
        <xsl:value-of select="@name"/>
      </td>
      <td style="background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 100%,rgb(255,255,255) 100%)">
        <xsl:value-of select="@rows"/>
      </td>
      <td style="background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 100%,rgb(255,255,255) 100%)">
        <xsl:value-of select="@reserved"/>
      </td>
      <td>
        <xsl:value-of select="@data"/>
      </td>
      <td>
        <xsl:value-of select="@indexSize"/>
      </td>
      <td>
        <xsl:value-of select="@unused"/>
      </td>
    </tr>
  </xsl:template>

  <xsl:template match="Table[@name='Customers']">
    <xsl:variable name="PrevRow" select="preceding-sibling::Table/@rows"/>
    <xsl:variable name="PrevReserved" select="preceding-sibling::Table/@reserved"/>
    <tr>
      <td>
        <xsl:value-of select="@name"/>
      </td>
      <td>
        <xsl:attribute name="style">
          <xsl:text>background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) </xsl:text>
          <xsl:value-of select="substring(((@rows div $PrevRow) * 100),1,2)"/>
          <xsl:text>%,rgb(255,255,255) 100%)</xsl:text>
        </xsl:attribute>
        <xsl:value-of select="@rows"/>
      </td>
      <td>
        <xsl:attribute name="style">
          <xsl:text>background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) </xsl:text>
          <xsl:value-of select="substring(((@reserved div $PrevReserved) * 100),1,2)"/>
          <xsl:text>%,rgb(255,255,255) 100%)</xsl:text>
        </xsl:attribute>
        <xsl:value-of select="@reserved"/>
        <br/>
        <xsl:value-of select="$PrevReserved"/>
      </td>
      <td>
        <xsl:value-of select="@data"/>
      </td>
      <td>
        <xsl:value-of select="@indexSize"/>
      </td>
      <td>
        <xsl:value-of select="@unused"/>
      </td>
    </tr>
  </xsl:template>

</xsl:stylesheet>

你得到这个输出:

<tr>
  <td>AuditLog</td>
  <td style="background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 100%,rgb(255,255,255) 100%)">13193925</td>
  <td style="background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 100%,rgb(255,255,255) 100%)">4896864</td>
  <td>2522592</td>
  <td>2373824</td>
  <td>448</td>
</tr>
<tr>
  <td>Customers</td>
  <td style="background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 53%,rgb(255,255,255) 100%)">7021839</td>
  <td style="background: linear-gradient(to right, #FF595E 0%,rgb(255,255,255) 66%,rgb(255,255,255) 100%)">3243392<br/>4896864</td>
  <td>1480640</td>
  <td>1762640</td>
  <td>112</td>
</tr>