需要使用XSL FO来缩放图像以适应

时间:2013-10-16 18:26:43

标签: xslt svg xsl-fo apache-fop

我正在开展一个项目,我们将图表和表格导出为PDF。我们正在使用Apache FOP进行PDF生成。图表在SVG中,如果只有一个,则显示正常。但是,我们将有最多四个的情况,在这些情况下,四个中只有三个适合生成的PDF。无论数量多少,我都需要适合所有图像。我担心简单地将页面放在横向上将是一个临时的解决方案,当我们需要更多的适合。每个图表的大小都是以Highcharts库中客户端生成的svg为单位设置的。看起来好像图像是在没有任何缩放的情况下插入到pdf中的,即使我按照这里看到的示例设置了instream-foreign-object的属性:Scaling images using scale-to-fit

所以我需要每个图表“缩小到合适”。我已经尝试设置元素的长度和宽度,该元素包含一个包含一个instream-foreign对象的元素(我也包括我的xsl)。在instream-foreign-object中,我正在分配svg width&高度为实际图表svg中的值。我想也许这就是问题,但如果我不包括这些尺寸,图表就不会出现在pdf中。我还尝试根据这里的问题将缩放属性设置为“非均匀”:Scale images with fixed height并且结果并没有更好。它实际上在整个页面上拉伸了一个图表,因此只显示了四个中的一个。这是我的xsl:

    <xsl:stylesheet version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:output method="xml" indent="yes"/>
<xsl:template match="/">
    <fo:root>
    <fo:layout-master-set>
        <fo:simple-page-master master-name="exportPage">
            <fo:region-body />
            </fo:simple-page-master>
        </fo:layout-master-set>
        <fo:page-sequence master-reference="exportPage">
        <fo:flow flow-name="xsl-region-body">
            <fo:block id="mainTitleBlock" font-family="arial, helvetica, sans-serif" color="#5c068c" font-weight="bold">
                <xsl:value-of  select="exports/export/charts/@mainTitle"/>
            </fo:block>
            <fo:block id="timestampBlock" font-family="arial, helvetica, sans-serif" font-size="small" color="#6D869F">
                <xsl:value-of  select="exports/export/charts/@timeStamp"/>
            </fo:block>
            <!-- This is where the charts go -->
            <!-- Within this block will be an inline element for each chart--> 
        <fo:block id="chartBlock" width="8.25in" height="6in">

          <xsl:apply-templates select="exports/export/charts/chart"/>

        </fo:block>
                <fo:block id="tableBlock" >
                    <xsl:apply-templates select="exports/export/table"/>
                </fo:block>
            </fo:flow>
            </fo:page-sequence>
         </fo:root>
</xsl:template>
   <!-- Creates the table -->
<xsl:template match="table">
<fo:table table-layout="fixed" width="100%" >
    <fo:table-header>
    <fo:table-row>
    <xsl:apply-templates select="tblRow[position() = 1]"/>
    </fo:table-row>
    </fo:table-header>
    <fo:table-body>
    <xsl:apply-templates select="tblRow[position() > 1]"/>
    </fo:table-body>
</fo:table>
</xsl:template>

<xsl:template match="hdrCell">
    <fo:table-cell background-color="#666" border-right-style="solid" border-right-width="1px" border-right-color="white" empty-cells="show">
    <fo:block color="white" font-family="arial, helvetica, sans-serif" font-size="x-small"><xsl:value-of select="."/></fo:block>
    </fo:table-cell>
</xsl:template>

<xsl:template match="tblCell">
    <fo:table-cell border-bottom-style="solid" border-bottom-width="1px" border-bottom-color="#E3E3E3" >
    <fo:block color="#7E7E7E" font-family="arial, helvetica, sans-serif" font-size="x-small"><xsl:value-of select="."/></fo:block>
    </fo:table-cell>
</xsl:template >

<xsl:template match="tblRow[position() > 1]">
    <fo:table-row>
    <xsl:apply-templates />
    </fo:table-row>
</xsl:template>

<xsl:template match="chart">
<fo:inline>
    <fo:instream-foreign-object xmlns:svg="http://www.w3.org/2000/svg" content-width="scale-to-fit" content-height="100%" width="100%" scaling="uniform">
    <svg:svg width="{svg:svg/@width}" height="{svg:svg/@height}">
    <xsl:copy-of select="svg:svg"/>
    </svg:svg>
    </fo:instream-foreign-object>
</fo:inline>
</xsl:template>

 </xsl:stylesheet>

我错过了什么?是否有助于在表格单元格中显示图表(从而打破了不使用表格进行布局的惯例 - 恐怖!)?如何在页面中缩放和缩放这些内容?

谢谢, 勃兰特

1 个答案:

答案 0 :(得分:2)

scale属性使图表适合包含块。如果您尚未为该块设置尺寸,则格式化引擎将不知道要缩放的大小,因此它将使用100%。 我不知道当你将多个图表放入一个块时会发生什么。

您可能需要将图表放在表格中,每列一个图表,以便根据图表数量设置列宽。