Ejemplo: Funciones para gráficos
A continuación puede ver un ejemplo de documento XSLT que muestra cómo usar las funciones de extensión para gráficos de Altova. Después ofrecemos un documento XML y una captura de pantalla de la imagen generada cuando el documento XML se procesa con el documento XSLT usando el motor XSLT 2.0 o 3.0.
Nota: | Las funciones para gráficos solamente son compatibles con las ediciones Enterprise y Server de los productos de Altova. |
Nota: | Para más información sobre las tablas de datos del gráfico, consulte la documentación de las herramientas XMLSpy y StyleVision de Altova. |
Documento XSLT
Este documento XSLT usa las funciones de extensión para gráficos de Altova para generar un gráfico circular. Este XSLT se puede usar para procesar el documento XML que aparece más abajo.
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="2.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:xs="http://www.w3.org/2001/XMLSchema"
xmlns:altovaext="http://www.altova.com/xslt-extensions"
exclude-result-prefixes="#all">
<xsl:output version="4.0" method="html" indent="yes" encoding="UTF-8"/>
<xsl:template match="/">
<html>
<head>
<title>
<xsl:text>HTML Page with Embedded Chart</xsl:text>
</title>
</head>
<body>
<xsl:for-each select="/Data/Region[1]">
<xsl:variable name="extChartConfig" as="item()*">
<xsl:variable name="ext-chart-settings" as="item()*">
<chart-config>
<General
SettingsVersion="1"
ChartKind="Pie3d"
BKColor="#ffffff"
ShowBorder="1"
PlotBorderColor="#000000"
PlotBKColor="#ffffff"
Title="{@id}"
ShowLegend="1"
OutsideMargin="3.2%"
TitleToPlotMargin="3.%"
LegendToPlotMargin="6.%"
>
<TitleFont
Color="#023d7d"
Name="Tahoma"
Bold="1"
Italic="0"
Underline="0"
MinFontHeight="10.pt"
Size="8.%" />
</General>
</chart-config>
</xsl:variable>
<xsl:sequence select="altovaext:create-chart-config-from-xml( $ext-chart-settings )"/>
</xsl:variable>
<xsl:variable name="chartDataSeries" as="item()*">
<xsl:variable name="chartDataRows" as="item()*">
<xsl:for-each select="(Year)">
<xsl:sequence select="altovaext:create-chart-data-row( (@id), ( .) )"/>
</xsl:for-each>
</xsl:variable>
<xsl:variable name="chartDataSeriesNames" as="xs:string*" select=" ( ("Series 1"), '' )[1]"/>
<xsl:sequence
select="altovaext:create-chart-data-series-from-rows( $chartDataSeriesNames, $chartDataRows)"/>
</xsl:variable>
<xsl:variable name="ChartObj" select="altovaext:create-chart( $extChartConfig, ( $chartDataSeries), false() )"/>
<xsl:variable name="sChartFileName" select="'mychart1.png'"/>
<img src="{$sChartFileName, altovaext:save-chart-image( $ChartObj, $sChartFileName, 400, 400 ) }"/>
</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Documento XML
Este documento XML se puede procesar con el XSLT que aparece arriba. Los datos del documento XML se usan para generar el gráfico circular de la imagen que aparece más abajo.
<?xml version="1.0" encoding="UTF-8"?>
<Data xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="YearlySales.xsd">
<ChartType>Pie Chart 2D</ChartType>
<Region id="Americas">
<Year id="2005">30000</Year>
<Year id="2006">90000</Year>
<Year id="2007">120000</Year>
<Year id="2008">180000</Year>
<Year id="2009">140000</Year>
<Year id="2010">100000</Year>
</Region>
<Region id="Europe">
<Year id="2005">50000</Year>
<Year id="2006">60000</Year>
<Year id="2007">80000</Year>
<Year id="2008">100000</Year>
<Year id="2009">95000</Year>
<Year id="2010">80000</Year>
</Region>
<Region id="Asia">
<Year id="2005">10000</Year>
<Year id="2006">25000</Year>
<Year id="2007">70000</Year>
<Year id="2008">110000</Year>
<Year id="2009">125000</Year>
<Year id="2010">150000</Year>
</Region>
</Data>
Imagen de salida
Este gráfico circular se generó al procesar el documento XML anterior con el archivo XSLT que aparece al principio de este apartado.