xsl: for-each в столбцах таблицы

Question

Я только начал изучать XML / XSL и в одном из своих заданий преодолел препятствия.Пробовал гуглить и искать здесь, но я не могу найти вопрос, который имеет базовое решение.Поэтому я пытаюсь отобразить погодные узлы в столбцах, а не в строках.Независимо от того, как я пытаюсь редактировать мои tr или td, вывод всегда будет одним столбцом.Не уверен, где я ошибся ...

Требуемый вывод : Изображение здесь

XML

<weather>
 <year>2019</year>  
 <month>2</month>
 <date>23</date>
 <dayOfWeek>THU</dayOfWeek> 
 <forecast>Plenty of sunshine</forecast>
 <overallCode>sunny</overallCode>
 <hightemperature scale="">25</hightemperature>
 <lowtemperature scale="">11</lowtemperature>
</weather>

<weather>
 <year>2019</year>  
 <month>2</month>
 <date>24</date>
 <dayOfWeek>WED</dayOfWeek> 
 <forecast>Partly sunny</forecast>
 <overallCode>partlySunny</overallCode> 
 <hightemperature scale="">21</hightemperature>
 <lowtemperature scale="">10</lowtemperature>
</weather>

<weather>
 <year>2019</year>  
 <month>2</month>
 <date>25</date>
 <dayOfWeek>TUE</dayOfWeek> 
 <forecast>A morning shower, then rain</forecast>
 <overallCode>rain</overallCode>
 <hightemperature scale="">19</hightemperature>
 <lowtemperature scale="">10</lowtemperature>
</weather>

XSL

<table border="1">

<xsl:for-each select="weather">
<xsl:sort select="date"/>

<tr>
<td>
            <font color="blue">
                <xsl:value-of select="dayOfWeek" /> 
            </font>
                <xsl:text>  </xsl:text>
                <xsl:value-of select="month" />
                <xsl:text>/</xsl:text>
                <xsl:value-of select="date" />
</td>
</tr>                   


<tr>
<td>                
    <img>
        <xsl:attribute name="src">
        <xsl:text>images/</xsl:text>
        <xsl:value-of select="overallCode"/>
        <xsl:text>.png</xsl:text>
        </xsl:attribute>

        <xsl:attribute name="width">
        <xsl:text>60px</xsl:text>
        </xsl:attribute>
    </img>
</td>
</tr>

<tr>
<td>
    <font size="6"><b><xsl:value-of select="hightemperature" />
    <xsl:text>&#176;</xsl:text></b></font>
    <xsl:text>/</xsl:text>
    <xsl:value-of select="lowtemperature" />
    <xsl:text>&#176;</xsl:text>
</td>
</tr>

<tr>
<td><xsl:value-of select="forecast" /></td>
</tr>


</xsl:for-each>
</table>

Прошу прощения, если мой код заставляет вас смеяться / злиться, я все еще учусь!

Answer 1

Транспонирование долгое время было хорошим вариантом использования для режимов .

Этот вход

<root>
  <weather>
    <year>2019</year>
    <month>2</month>
    <date>23</date>
    <dayOfWeek>THU</dayOfWeek>
    <forecast>Plenty of sunshine</forecast>
    <overallCode>sunny</overallCode>
    <hightemperature scale="">25</hightemperature>
    <lowtemperature scale="">11</lowtemperature>
  </weather>
  <weather>
    <year>2019</year>
    <month>2</month>
    <date>24</date>
    <dayOfWeek>WED</dayOfWeek>
    <forecast>Partly sunny</forecast>
    <overallCode>partlySunny</overallCode>
    <hightemperature scale="">21</hightemperature>
    <lowtemperature scale="">10</lowtemperature>
  </weather>
  <weather>
    <year>2019</year>
    <month>2</month>
    <date>25</date>
    <dayOfWeek>TUE</dayOfWeek>
    <forecast>A morning shower, then rain</forecast>
    <overallCode>rain</overallCode>
    <hightemperature scale="">19</hightemperature>
    <lowtemperature scale="">10</lowtemperature>
  </weather>
</root>

И это преобразование

<xsl:stylesheet version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <xsl:output indent="yes" />
    <xsl:key name="kByName" match="weather/*" use="name()" />
    <xsl:template match="text()|weather[position()!=1]" />
    <xsl:template match="root">
        <table>
            <xsl:apply-templates />
        </table>
    </xsl:template>
    <xsl:template match="dayOfWeek|overallCode|hightemperature|forecast">
        <tr>
            <xsl:apply-templates
                select="key('kByName',name())" mode="cell" />
        </tr>
    </xsl:template>
    <xsl:template match="dayOfWeek" mode="cell">
        <td>
            <font color="blue">
                <xsl:value-of select="." />
            </font>
            <xsl:value-of select="concat(' ',../month,'/',../date)" />
        </td>
    </xsl:template>
    <xsl:template match="overallCode" mode="cell">
        <td>
            <img src="images/{.}.png" width="60px" />
        </td>
    </xsl:template>
    <xsl:template match="hightemperature" mode="cell">
        <td>
            <font size="6">
                <b>
                    <xsl:value-of select="concat(.,'&#176;')" />
                </b>
            </font>
            <xsl:value-of
                select="concat('/',../lowtemperature,'&#176;')" />
        </td>
    </xsl:template>
    <xsl:template match="forecast" mode="cell">
        <td>
            <xsl:value-of select="." />
        </td>
    </xsl:template>
</xsl:stylesheet>

Результаты

<table>
   <tr>
      <td>
         <font color="blue">THU</font> 2/23</td>
      <td>
         <font color="blue">WED</font> 2/24</td>
      <td>
         <font color="blue">TUE</font> 2/25</td>
   </tr>
   <tr>
      <td>Plenty of sunshine</td>
      <td>Partly sunny</td>
      <td>A morning shower, then rain</td>
   </tr>
   <tr>
      <td>
         <img src="images/sunny.png" width="60px"/>
      </td>
      <td>
         <img src="images/partlySunny.png" width="60px"/>
      </td>
      <td>
         <img src="images/rain.png" width="60px"/>
      </td>
   </tr>
   <tr>
      <td>
         <font size="6">
            <b>25°</b>
         </font>/11°</td>
      <td>
         <font size="6">
            <b>21°</b>
         </font>/10°</td>
      <td>
         <font size="6">
            <b>19°</b>
         </font>/10°</td>
   </tr>
</table>

Answer 2

Если вы хотите повернуть таблицу, вы должны создать строки вручную и использовать xsl:for-each для создания ячеек в каждой строке.

Пример:

XML

<forecast>
  <weather>
    <year>2019</year>
    <month>2</month>
    <date>23</date>
    <dayOfWeek>THU</dayOfWeek>
    <forecast>Plenty of sunshine</forecast>
    <overallCode>sunny</overallCode>
    <hightemperature scale="">25</hightemperature>
    <lowtemperature scale="">11</lowtemperature>
  </weather>
  <weather>
    <year>2019</year>
    <month>2</month>
    <date>24</date>
    <dayOfWeek>WED</dayOfWeek>
    <forecast>Partly sunny</forecast>
    <overallCode>partlySunny</overallCode>
    <hightemperature scale="">21</hightemperature>
    <lowtemperature scale="">10</lowtemperature>
  </weather>
  <weather>
    <year>2019</year>
    <month>2</month>
    <date>25</date>
    <dayOfWeek>TUE</dayOfWeek>
    <forecast>A morning shower, then rain</forecast>
    <overallCode>rain</overallCode>
    <hightemperature scale="">19</hightemperature>
    <lowtemperature scale="">10</lowtemperature>
  </weather>
</forecast>

XSLT 1.0

<xsl:stylesheet version="1.0" 
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="xml" omit-xml-declaration="yes" version="1.0" encoding="utf-8" indent="yes"/>

<xsl:template match="/forecast">
    <xsl:variable name="col" select="weather"/>
    <table border="1" >
        <!-- DATE -->
        <tr>
            <xsl:for-each select="$col">
                <td>
                    <font color="blue">
                        <xsl:value-of select="dayOfWeek" /> 
                    </font>
                    <xsl:text> </xsl:text>
                    <xsl:value-of select="month" />
                    <xsl:text>/</xsl:text>
                    <xsl:value-of select="date" />
                </td>
            </xsl:for-each>
        </tr>
        <!-- IMG -->
        <tr>
            <xsl:for-each select="$col">
                <td>
                    <img src="images/{overallCode}.png" width="60px"/>
                </td>
            </xsl:for-each>
        </tr>
        <!-- HIGH/LOW -->
        <tr>
            <xsl:for-each select="$col">
                <td>
                    <font size="6">
                        <b>
                            <xsl:value-of select="hightemperature" />
                            <xsl:text>&#176;</xsl:text>
                        </b>
                    </font>
                    <xsl:text>/</xsl:text>
                    <xsl:value-of select="lowtemperature" />
                    <xsl:text>&#176;</xsl:text>
                </td>
            </xsl:for-each>
        </tr>
        <!-- FORECAST -->
        <tr>
            <xsl:for-each select="$col">
                <td>
                    <xsl:value-of select="forecast" />
                </td>
            </xsl:for-each>
        </tr>
    </table>
</xsl:template> 

</xsl:stylesheet>

Результат

<table border="1">
  <tr>
    <td><font color="blue">THU</font> 2/23</td>
    <td><font color="blue">WED</font> 2/24</td>
    <td><font color="blue">TUE</font> 2/25</td>
  </tr>
  <tr>
    <td>
      <img src="images/sunny.png" width="60px"/>
    </td>
    <td>
      <img src="images/partlySunny.png" width="60px"/>
    </td>
    <td>
      <img src="images/rain.png" width="60px"/>
    </td>
  </tr>
  <tr>
    <td><font size="6"><b>25°</b></font>/11°</td>
    <td><font size="6"><b>21°</b></font>/10°</td>
    <td><font size="6"><b>19°</b></font>/10°</td>
  </tr>
  <tr>
    <td>Plenty of sunshine</td>
    <td>Partly sunny</td>
    <td>A morning shower, then rain</td>
  </tr>
</table>

---

PS Рассмотрите возможность использованиявстроенный CSS вместо элементов стиля.