Question

我使用Apache FOP将svg图像从我的应用程序渲染为PDF。

让我说我有这个形象：

<svg id="drawingSpace" height="965" width="717" version="1.1" xmlns="http://www.w3.org/2000/svg">
    <image id="782" y="434.9338297750881" x="236.63121279426443" width="30" height="30" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="https://dl.dropboxusercontent.com/u/7680249/iconBlueGreenStrokeRectangle.svg" style="cursor: pointer;"/>
</svg>

如果我在浏览器中查看它，这是完全正确的，它的大小是30x30像素。但是当然SVG Image i的加载大小不同。我用Batik创建了它并将其上传到我的Dropbox，它看起来像这样：

<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.0//EN'
          'http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd'>
<svg style="stroke-dasharray:none; shape-rendering:auto; font-family:'Dialog'; text-rendering:auto; fill-opacity:1; color-interpolation:auto; color-rendering:auto; font-size:12px; fill:black; stroke:black; image-rendering:auto; stroke-miterlimit:10; stroke-linecap:square; stroke-linejoin:miter; font-style:normal; stroke-width:1; stroke-dashoffset:0; font-weight:normal; stroke-opacity:1;" xmlns="http://www.w3.org/2000/svg" width="250" contentScriptType="text/ecmascript" preserveAspectRatio="xMidYMid meet" xmlns:xlink="http://www.w3.org/1999/xlink" zoomAndPan="magnify" version="1.0" contentStyleType="text/css" height="250"
><!--Generated by the Batik Graphics2D SVG Generator--><defs id="genericDefs"/>
    <g>
        <g style="fill:rgb(60,123,190); stroke:rgb(60,123,190);">
            <rect x="12" width="225" height="225" y="12" style="stroke:none;"/>
        </g>
        <g style="fill:lime; stroke-width:25; stroke-linecap:butt; stroke:lime;">
            <rect x="12" width="225" height="225" y="12" style="fill:none;"/>
        </g>
    </g>
</svg>

如您所见，此图像的大小为250x250像素，我假设它与我生成的pdf中的大小相同。

我在另一个类中生成pdf，如此

Transcoder transcoder = new PDFTranscoder();
    // Setup input
    Reader in = new java.io.StringReader(svg);

    try {
        TranscoderInput input = new TranscoderInput(in);
        // Setup output
        try {
            TranscoderOutput output = new TranscoderOutput(out);
            // Do the transformation
            transcoder.transcode(input, output);
        } finally {
            out.close();
        }
    } finally {
        in.close();
    }

其中svg是String我给这个转码器。

是否有可能让FOP渲染图像在浏览器中的大小或包含svg？

如果我将svg更换为png图片，它的效果非常好。

我的应用程序呈现这样的svg / png图片。我使用的是d3js。

var points = this.plot.selectAll("image").data(this.projectMap.mainTasks);
      points.enter().append("svg:image")
        .attr("y", (d:rest.ProjectMapMainTaskResource) => {
          return this.yScale(d.position) - 5;
        })
        .attr("x", (d:rest.ProjectMapMainTaskResource) => {
          return this.xScale(d.date) - 5;
        })
        .attr("width", "30")
        .attr("height", "30")
        .attr("xlink:href", "https://dl.dropboxusercontent.com/u/7680249/iconBlueGreenStrokeRectangle.svg");
      points.exit().remove();

Apache FOP呈现错误的图像大小

0 个答案: