将包含外部 CSS 的 SVG 转换为图像 java

Convert SVG include external CSS to image java

我想将 SVG 文件转换成图像。问题是我的 SVG 使用外部 CSS 文件,当我使用 Apache Batik 时,它无法识别外部 CSS 文件,它只显示内联 SVG 标签的样式。这是我的示例代码:

public static void svg2jpgBatik1() {
        JPEGTranscoder transcoder = new JPEGTranscoder();

        try {

            // Create a JPEG transcoder
            JPEGTranscoder t = new JPEGTranscoder();
            // Set the transcoding hints.
            t.addTranscodingHint(JPEGTranscoder.KEY_QUALITY,
                    0.8f);

            // Create the transcoder input.
            String svgURI = new File("D:\SVG_PATH\map.svg").toURL().toString();
            TranscoderInput input = new TranscoderInput(svgURI);

            // Create the transcoder output.
            OutputStream ostream = new FileOutputStream("D:\JPEG_PATH\map.jpg");
            TranscoderOutput output = new TranscoderOutput(ostream);
            t.addTranscodingHint(JPEGTranscoder.KEY_ALTERNATE_STYLESHEET, "D:\STYLESHEET_PATH\style.css");
            t.addTranscodingHint(JPEGTranscoder.KEY_BACKGROUND_COLOR, Color.blue);

            // Save the image.
            t.transcode(input, output);

            // Flush and close the stream.
            ostream.flush();
            ostream.close();
        } catch (Exception e) {
            e.printStackTrace();
        } 
    }

这一行有效:

t.addTranscodingHint(JPEGTranscoder.KEY_BACKGROUND_COLOR, Color.blue);

虽然这条线不起作用:

 t.addTranscodingHint(JPEGTranscoder.KEY_ALTERNATE_STYLESHEET, "D:\STYLESHEET_PATH\style.css");

到 SVG 中我添加了这部分:

<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 10 1000" preserveAspectRatio="xMinYMin meet"> 
<defs>
    <link href="STYLESHEET_PATH\style.css" type="text/css" rel="stylesheet" 
          xmlns="http://www.w3.org/1999/xhtml"/>

  </defs>

当我在浏览器中打开它时应用了 SVG,但在 batik 中它不适用。

我也把样式放到了SVG的标签里,结果还是一样

它唯一可以应用的样式是内联 SVG 样式,例如 fill="#FFFFFF":

<text text-anchor="middle" alignment-baseline="middle"  x="624" xml:space="preserve" y="123.0" 
       fill="#FFFFFF"  >Sample Text</text>

我想知道是否有人可以帮助我解决这个问题,或者让我知道在我转换它时从 External CSS 获得 SVG 样式的最佳替代方案到图像。

提前致谢。

我在 SVG 代码的顶部添加了这一行:

<?xml-stylesheet type="text/css" href="style.css" ?>

代替 SVG 标签后的这部分:

<defs>
    <link href="style.css" type="text/css" rel="stylesheet" 
          xmlns="http://www.w3.org/1999/xhtml"/>

  </defs>

现在它使用外部 CSS 文件的样式制作图像。

所以 SVG 文件将是:

<?xml-stylesheet type="text/css" href="style.css" ?>
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 10 1000" preserveAspectRatio="xMinYMin meet">