Как мне наложить одно изображение SVG на другое, используя Apache Batik? - PullRequest
Новая
       4

Как мне наложить одно изображение SVG на другое, используя Apache Batik?

9 голосов
/ 14 июня 2010

У меня есть 2 SVG-файла, которые мне нужно наложить с помощью батика.Один файл служит фоновым изображением и имеет размер 308 на 308 пикселей, в то время как второй файл (260 на 260 пикселей) является изображением на переднем плане, которое должно быть центрировано (то есть в центре фонового изображения).Я хотел бы, чтобы результат операции был сохранен в третьем файле SVG.Если вы знакомы с батиком, я буду признателен за ваши предложения.

Спасибо,

Оливье.

1 Ответ

8 голосов
/ 22 июня 2010

Если вам не нужно включать содержимое документов фона и переднего плана в окончательный вариант, вы можете просто ссылаться на них: 

<svg xmlns='http://www.w3.org/2000/svg'
     xmlns:xlink='http://www.w3.org/1999/xlink'
     width='308' height='308' viewBox='0 0 308 308'>
  <image xlink:href='background.svg' width='308' height='308'/>
  <image xlink:href='foreground.svg' x='24' y='24' width='260' height='260'/>
</svg>

Этот документ должен быть простым для построения с использованиемDOM.См. здесь для примера использования API DOM для создания документа.

Если вам нужно объединить два документа в один, то вы можете:

  • let a = Document, полученный в результате анализа background.svg
  • let b = Document, полученный в результате анализа переднего плана.svg
  • let e = a.importNode(b.getDocumentElement(), true)
  • установить атрибуты x и y e до "24"
  • вызов a.getDocumentElement().appendChild(e)

Теперь a - это документ с объединенным содержимым переднего плана.

...