Навигация по SVG и проверка документа

Проверка содержимого файлов SVG часто необходима для извлечения информации о файле, его элементах и ​​их иерархии. Aspose.SVG for Python via .NET API полностью соответствует официальным спецификациям SVG и предоставляет обширные функциональные возможности для работы с объектной моделью документов SVG (DOM). Этот API поддерживает широкий спектр возможностей навигации и проверки содержимого SVG.

В этой статье вы узнаете:

• как просматривать содержимое SVG в виде строки, извлекая все содержимое SVG в строковом формате для удобства просмотра и манипулирования;
• как проверить документ и его элементы с помощью API.
• как получить информацию о конкретном элементе в файле SVG, например атрибуты и стили.
• как перемещаться по документу с помощью селекторов CSS и запросов XPath для поиска элементов и управления ими.

Чтобы продолжить следовать этому руководству, вам необходимо установить и настроить библиотеку Aspose.SVG for Python via .NET в вашем проекте Python. Примеры кода помогут вам создавать, загружать и читать файлы SVG с помощью библиотеки Python.

Просмотр содержимого SVG

Самый простой способ проверить содержимое документа – просмотреть содержимое как строку. Свойства inner_html и outer_html класса Element возвращают фрагмент XML (или HTML), который представляет элемент и его содержимое. Они разработаны именно для просмотра содержимого SVG в виде строки. В следующем примере кода Python показано, как просмотреть содержимое файла SVG в консоли:

1. Определите полный путь к файлу SVG, который вы хотите загрузить.
2. Используйте класс SVGDocument, чтобы загрузить файл SVG по указанному пути.
3. Получите внешний HTML корневого элемента документа, используя свойство outer_html.
4. Распечатайте HTML-содержимое документа SVG на консоли, чтобы просмотреть его структуру и содержимое.

import os
from aspose.svg import SVGDocument

# Setup directories
data_dir = "data/"
document_path = os.path.join(data_dir, "document.svg")

# Load an SVG document
with SVGDocument(document_path) as document:
    html = document.document_element.outer_html

    print(html)
# View the document content

Навигация и проверка SVG с использованием DOM

Объектная модель документа (DOM) имеет решающее значение для навигации по файлам SVG, обеспечивая структурированное представление элементов документа и их взаимосвязей. Он обеспечивает программный доступ к элементам и атрибутам SVG, позволяя проводить детальную проверку и манипулирование. Через DOM разработчики могут перемещаться по структуре SVG, используя методы выбора элементов по имени тега, классу или идентификатору. Они также могут использовать селекторы CSS и запросы XPath для эффективного поиска определенных элементов. Эта иерархическая модель позволяет легко читать и изменять содержимое SVG, получать подробную информацию о конкретных элементах и ​​гибко и мощно взаимодействовать с SVG.

Извлечение информации о конкретном элементе SVG

В следующем примере показано, как извлечь информацию о конкретном элементе SVG из файла shapes.svg. Этот фрагмент кода демонстрирует, как загрузить документ SVG, перебрать определенные элементы (в данном случае <rect>), а также безопасно получить доступ и распечатать их атрибуты:

1. Настройте переменную input_path так, чтобы она указывала на фактическое местоположение файла SVG.
2. Используйте конструктор SVGDocument(input_path) для загрузки файла SVG по указанному входному_пути.
3. Используйте метод get_elements_by_tag_name(“rect”) для перебора всех элементов <rect> в документе SVG.
4. Распечатайте имя тега и идентификатор каждого элемента <rect>.

fimport os
from aspose.svg import SVGDocument

# Prepare a path to the source and output SVG file
data_dir = "data/"
input_path = os.path.join(data_dir, "shapes.svg")

# Load the SVG document
document = SVGDocument(input_path)

# Iterate over elements in the SVG document
for element in document.get_elements_by_tag_name("rect"):
    print(f"Element: {element.tag_name}, ID: {element.id}")

# Print attributes of the element
    attributes = element.attributes
    for i in range(attributes.length):
        attr = attributes[i]
        if attr is not None:
            print(f" Attribute: {attr.name} = {attr.value}")

После запуска этого примера вы получите следующий результат:

Element: rect, ID: first-rect
  Attribute: id = first-rect
  Attribute: x = 50
  Attribute: y = 90
  Attribute: width = 100
  Attribute: height = 90
  Attribute: style = stroke-width:5; stroke:FireBrick
Element: rect, ID: second-rect
  Attribute: id = second-rect
  Attribute: x = 120
  Attribute: y = 150
  Attribute: width = 120
  Attribute: height = 120
  Attribute: style = stroke-width:10; stroke:DarkCyan
Element: rect, ID: third-rect
  Attribute: id = third-rect
  Attribute: x = 170
  Attribute: y = 220
  Attribute: width = 90
  Attribute: height = 90
  Attribute: style = stroke-width:5; stroke:FireBrick

Проверка документа SVG и его элементов

Aspose.SVG содержит список методов, основанных на Спецификациях обхода элементов. Вы можете выполнить детальную проверку документа и его элементов с помощью API. В следующем примере кода показано обобщенное использование функций обхода элементов.

Вот код Python, который загружает документ SVG ( shapes.svg), перемещается по его элементам и печатает имена тегов:

import os
from aspose.svg import SVGDocument

# Setup directories
data_dir = "data/"
document_path = os.path.join(data_dir, "shapes.svg")

# Load a document
with SVGDocument(document_path) as document:
    # Get the root element
    element = document.document_element
    print(element.tag_name)  # svg

    # Get the last child element of the root (which should be a <g> element)
    element = element.last_element_child
    print(element.tag_name)  # g

    # Get the first child element of the <g> element (which should be a <rect> element)
    element = element.first_element_child
    print(element.tag_name)  # rect

1. Элемент <svg> является контейнером и используется как самый внешний элемент документов SVG. Чтобы указать элемент <svg>, вы используете свойство document_element класса SVGDocument, предоставляющее прямой доступ к элементу <svg> документа. В приведенном выше фрагменте кода мы используем этот способ.
2. Свойство last_element_child возвращает последний узел дочернего элемента этого элемента. В приведенном выше примере это элемент <g>.
3. Согласно приведенному выше фрагменту кода, свойство first_element_child возвращает первого дочернего элемента элемента . Это элемент <rect>.n

Редактировать SVG с помощью селектора CSS

Aspose.SVG for Python via .NET также реализует спецификацию CSS Selector, которая позволяет вам перемещаться по документу, используя стиль, подобный CSS.

Метод query_selector(selector) класса Element позволяет получить первый элемент в документе, соответствующий указанному селектору. Метод query_selector_all(selector) принимает в качестве параметра селектор запроса и возвращает NodeList всех элементов, соответствующих селектору. С получившимися элементами можно производить различные манипуляции: менять его текст, атрибуты, стили CSS и так далее.

В следующем примере мы используем метод query_selector() для навигации по документу SVG и поиска необходимого элемента для редактирования:

import os
from aspose.svg import SVGDocument

# Setup directories
output_dir = "output/"
data_dir = "data/"

document_path = os.path.join(data_dir, "shapes.svg")

# Load an SVG document from the file
document = SVGDocument(document_path)

# Get root svg element of the document
svg_element = document.root_element

# Get circle element to change color
circle_element = svg_element.query_selector("circle")

# Set a new "fill" attribute value for the circle element
circle_element.set_attribute("stroke", "DarkCyan")

# Save the SVG document to a file
output_path = os.path.join(output_dir, "circle-color.svg")
document.save(output_path)

На рисунке: исходное изображение (а) и отредактированное изображение (б).

Навигация по SVG с помощью запроса XPath

XPath Query ( XML Path Language), часто называемый просто XPath, представляет собой язык запросов, используемый для запроса данных из документов. Он основан на DOM-представлении документа SVG и выбирает узлы по различным критериям. Синтаксис выражений XPath довольно прост и, что более важно, его легко читать и поддерживать.

Aspose.SVG также имеет мощную реализацию спецификаций XPath наряду со спецификациями обхода. Запросы XPath в основном выполняются с использованием метода evaluate() класса Document. Метод evaluate(expression, contextNode,solver, type, result) принимает выражение XPath и другие заданные параметры и возвращает результат указанного типа. Это позволит вам использовать XPath Query для навигации по документу ( shapes.svg), как показано в следующем примере кода:

import os
from aspose.svg import SVGDocument
from aspose.svg.dom.xpath import XPathResultType

# Setup directories
output_dir = "output/"
data_dir = "data/"
if not os.path.exists(output_dir):
    os.makedirs(output_dir)

# Prepare a path to a file loading
document_path = os.path.join(data_dir, "shapes.svg")

# Load an SVG document from the file
document = SVGDocument(document_path)

# Evaluate XPath expression
xpath_expression = "//rect[@x='120']"
xpath_result = document.evaluate(xpath_expression, document, None, XPathResultType.ANY, None)

# Get the next evaluated node and print its parent_element
node = xpath_result.iterate_next()
if node:
    print(node.parent_element)

Смотрите также

• В статье Установка представлено пошаговое руководство по установке Aspose.SVG for Python via .NET на ваш компьютер.
• Если вы заинтересованы в настройке лицензии, применении дозированной лицензии или хотите попробовать ознакомительную версию библиотеки Aspose.SVG Python, обратитесь к статье Лицензирование.
• Сценарии конвертации и рендеринга SVG в другие форматы можно посмотреть в разделе Конвертировать файлы SVG в Python.