Java 蜡染-将SVG置于图像顶部

Java 蜡染-将SVG置于图像顶部,java,image-processing,svg,batik,Java,Image Processing,Svg,Batik,我有一个图像文件(jpg等)和一些svg图形(svg标记从站点复制,作为Java字符串)。svg图形与图像文件具有相同的分辨率。我想将svg图形放在图像的顶部,并将其保存为一个文件。我的方法是: 使用Batik的JPEG转码器将svg转码为具有此svg图形和白色背景的图像,保存此图像 通过对每个像素执行低级操作,将带有svg图形的图像放在我的图像文件的顶部 我希望能够一步将svg图形放在我的图像顶部。使用svg模式可以解决您的问题 <svg xmlns="http://www.w3.o

我有一个图像文件(jpg等)和一些svg图形(svg标记从站点复制,作为Java字符串)。svg图形与图像文件具有相同的分辨率。我想将svg图形放在图像的顶部,并将其保存为一个文件。我的方法是:

  • 使用Batik的JPEG转码器将svg转码为具有此svg图形和白色背景的图像,保存此图像
  • 通过对每个像素执行低级操作,将带有svg图形的图像放在我的图像文件的顶部

我希望能够一步将svg图形放在我的图像顶部。

使用svg模式可以解决您的问题

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
    width="200" height="200">
  <defs>
    <pattern id="image" x="0" y="0" patternUnits="userSpaceOnUse" height="200" width="200">
        <image x="0" y="0" width="200" height="200"
            xlink:href="http://cdn.sstatic.net/stackexchange/img/logos/so/so-logo.png"/>
    </pattern>
  </defs>
  <rect width="200" height="200" fill="url(#image)"/>
  <circle cx="100" cy="100" r="50"/>
</svg>

小提琴可用

我将上面的SVG拉过蜡染光栅化器,它被正确地光栅化了

更新
如注释中所述,您也可以直接将图像包含在SVG中,而不使用模式

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
      width="200" height="200">
  <image x="0" y="0" width="200" height="200"
      xlink:href="http://cdn.sstatic.net/stackexchange/img/logos/so/so-logo.png"/>
  <circle cx="100" cy="100" r="50"/>
</svg>


小提琴可用。

使用SVG模式可以解决您的问题

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
    width="200" height="200">
  <defs>
    <pattern id="image" x="0" y="0" patternUnits="userSpaceOnUse" height="200" width="200">
        <image x="0" y="0" width="200" height="200"
            xlink:href="http://cdn.sstatic.net/stackexchange/img/logos/so/so-logo.png"/>
    </pattern>
  </defs>
  <rect width="200" height="200" fill="url(#image)"/>
  <circle cx="100" cy="100" r="50"/>
</svg>

小提琴可用

我将上面的SVG拉过蜡染光栅化器,它被正确地光栅化了

更新
如注释中所述,您也可以直接将图像包含在SVG中,而不使用模式

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
      width="200" height="200">
  <image x="0" y="0" width="200" height="200"
      xlink:href="http://cdn.sstatic.net/stackexchange/img/logos/so/so-logo.png"/>
  <circle cx="100" cy="100" r="50"/>
</svg>


小提琴可用。

您认为为什么需要一个图案?为什么不直接使用
标记包含图像呢?@RobertLongson这会更简单,也应该同样有效。谢谢你的评论,我会更新我的答案。太好了!谢谢!为什么你认为模式是必要的?为什么不直接使用
标记包含图像呢?@RobertLongson这会更简单,也应该同样有效。谢谢你的评论,我会更新我的答案。太好了!谢谢!