Как преобразовать "контуры" SVG-изображения в отдельные PNG-изображения?

Question

У меня есть изображение SVG с 67 отдельными путями.

Существуют ли какие-либо библиотеки / учебные пособия, которые будут создавать отдельные растровые изображения, такие как PNG для каждого из этих путей, и, возможно, называть их в соответствии с идентификатором пути?

Answer 1

Я не знаю ни одной библиотеки, которая бы поддерживала этот точный рабочий процесс напрямую, но это, вероятно, потому что, по крайней мере, на первый взгляд это кажется тривиальным. Предполагая, что вы говорите о высшем уровне <path/> узлы, то это должно быть осуществимо с любой библиотекой, которая может работать с XML - просто работайте с необработанным XML напрямую и игнорируйте тот факт, что этот конкретный документ является SVG. Если у вас есть:

<svg ...>
  <path title="a" d="M 100 100 L 300 100 L 200 300 z" stroke-width="3" />
  <path title="b" d="M 200 100 L 300 100 L 200 300 z" stroke-width="3" />
  <path title="c" d="M 300 100 L 300 100 L 200 300 z" stroke-width="3" />
</svg>

И вы хотите:

[a.svg]
<svg ...>
  <path d="M 100 100 L 300 100 L 200 300 z" stroke="blue" stroke-width="3" />
</svg>

[b.svg]
<svg ...>
  <path d="M 200 100 L 300 100 L 200 300 z" stroke="blue" stroke-width="3" />
</svg>

Затем вам просто нужно использовать выбранный вами язык / библиотеку / инструмент и определить путь к узлам "пути", извлечь их из корневого документа и получить атрибут заголовка, а также скопировать их в новый документ, который имеет тот же оригинал Атрибуты canvas (если это уместно в вашем случае - или измените их на все, что вам нужно) с заголовком в качестве имени файла. Это должно быть довольно тривиально для любого XML-парсера и даже самого базового API для обработки DOM (или XSLT/XPATH и т. Д.).

Answer 2

Спасибо всем. Я закончил тем, что использовал комбинацию двух ответов. Я использовал скрипт Ruby для анализа файлов SVG и написания нового для каждого пути, а затем преобразователя батика для генерации png из этого файла. Принятый ответ идет Нику из-за ключевой идеи, что легко создавать отдельные SVG. Спасибо, Ник!

Вот сценарий:

require 'rubygems'
require 'nokogiri'
file = 'dark_florida_no_numbers.svg'

file_string = IO.read(file)

reader = Nokogiri::XML::Reader(file_string)

reader.each do |node|

  if node.name == 'path'
    county = node.attributes['id']
    File.open("dark/#{county}.svg", 'w') do |f|
      f.write "<svg xmlns:svg=\"http://www.w3.org/2000/svg\" xmlns=\"http://www.w3.org/2000/svg\" version=\"1.0\" >\n  <path "
      node.attributes.each do |attr, value|
        f.write " #{attr}=\"#{value}\""
      end
      f.write "/>\n</svg>"
    end
    `java -jar b/batik-rasterizer.jar dark/#{county}.svg`
  end
end

Answer 3

Библиотека Apache Batik - это библиотека Java для отображения и управления содержимым SVG. Для создания файлов PNG вы можете использовать их DOM API для установки display приписывать none на всех путях, кроме того, который вы хотите визуализировать, а затем используйте их Transcoder API для генерации растровых изображений. Обведите все элементы пути в документе SVG и установите display приписывать inline по одному за раз, чтобы сгенерировать растровое изображение для каждого элемента пути.