Как изменить размер документа при конвертации из SVG? – C#

В современном мире большинство документов имеют формат A4, но иногда контент, рендеренный из SVG, имеет другой размер. Это приводит к появлению большого количества пустого пространства на странице, или контент просто не помещается! В этой статье мы рассмотрим, как использовать параметры рендеринга для изменения размера страниц документа в соответствии с размером содержимого и наоборот.

Как изменить размер документа при рендеринге используя Aspose.SVG

Пространство имен Aspose.Svg.Rendering предоставляет мощный набор инструментов, таких как классы, интерфейсы и перечисления для рендеринга документов SVG в различные выходные форматы, такие как PDF, XPS и изображения. По умолчанию SVG конвертируется в документ формата A4, что, вероятно, приведёт к появлению пустого пространства вокруг изображения. Иногда необходимо обрезать документы, чтобы создать страницу меньшего размера, соответствующую размеру содержимого.

Класс PageSetup предоставляет набор свойств для управления настройками страниц документов SVG при их рендеринге в различные форматы файлов. Рассмотрим наиболее используемые из них:

Настройка страницы. Свойство AnyPage позволяет задавать настройки страницы (размер, поля, ориентацию и т. д.) для любой страницы документа SVG, который рендерится в многостраничный формат, такой как PDF, XPS, PNG, JPG и т. д. Для управления настройками страницы используйте классы Page, Size и Margin.
Изменение размера документа в соответствии с размером содержимого. Вы можете подогнать размер страницы к содержимому и наоборот, используя свойство Sizing с перечислением SizingType. Это свойство представляет собой набор битовых флагов, управляющих поведением рендерера. Вы можете обрезать или масштабировать документы, чтобы их содержимое соответствовало размеру страницы.

Вы можете легко использовать примеры кода на C# из этой статьи для конвертации SVG в изображения, PDF и XPS с настраиваемым макетом страницы. Единственные различия заключаются в указании:

соответствующих параметров рендеринга – ImageRenderingOption, PdfRenderingOption или XpsRenderingOption;
соответствующего выходного устройства – ImageDevice, PdfDevice или XpsDevice.

SVG в PNG с настройками рендеринга по умолчанию

Чтобы конвертировать SVG в PNG с настройками рендеринга по умолчанию, выполните несколько шагов:

Используйте один из конструкторов SVGDocument() для инициализации экземпляра document. В следующих примерах мы загружаем локальный SVG-файл.
Инициализируйте экземпляр класса ImageRenderingOption, если хотите конвертировать SVG в формат изображения. По умолчанию ImageFormat – PNG.
Создайте новый экземпляр класса ImageDevice. Используйте конструктор ImageDevice(), принимающий options и путь для сохранения savePath в качестве параметров.
Используйте метод RenderTo(device), чтобы конвертировать SVG в PNG, передав device в качестве параметра.

В следующем фрагменте кода C# показан пример преобразования документа SVG в изображение без каких-либо дополнительных опций, то есть с опциями рендеринга по умолчанию. В результате был получен документ PNG формата A4 с большим количеством пустого пространства (см. иллюстрации результатов преобразования (a)).

1using Aspose.Svg.Rendering;
2using Aspose.Svg.Rendering.Image;
3using System.IO;

 1// Convert SVG to PNG with default RenderingOptions
 2
 3// Prepare path to a source SVG file
 4string documentPath = Path.Combine(DataDir, "rendering.svg");
 5
 6// Prepare a path to save the converted file 
 7string savePath = Path.Combine(OutputDir, "a4.png");
 8
 9// Create an instance of the SVGDocument class
10using SVGDocument document = new SVGDocument(documentPath);
11
12// Initialize an ImageRenderingOptions object with default options
13ImageRenderingOptions opt = new ImageRenderingOptions();
14
15// Create an output rendering device and convert SVG
16using ImageDevice device = new ImageDevice(opt, savePath);
17document.RenderTo(device);

Example-ConvertSvgToPngWithDefaultRenderingOptions.cs hosted with ❤ by GitHub

Параметры рендеринга

Перечисление SizingType в пространстве имен Aspose.Svg.Rendering определяет флаги, которые вместе с другими параметрами PageSetup задают различные стратегии настройки размера страницы или содержимого при рендеринге SVG-документов.

Название	Описание
FitContent	Подгоняет размер страницы под содержимое без масштабирования. Это гарантирует, что весь контент SVG будет видимым без лишних полей. Идеально подходит для документов, где размер страницы должен определяться содержимым.
ScaleContent	Масштабирует содержимое под заданный размер страницы. Соотношение сторон содержимого может изменяться для соответствия указанным размерам. Этот параметр полезен, если содержимое должно соответствовать фиксированному макету страницы.
Contain	Изменяет размер содержимого так, чтобы оно вписывалось в размеры страницы при сохранении соотношения сторон. В отличие от `ScaleContent`, этот метод сохраняет пропорции, что может привести к появлению пустого пространства, если соотношение сторон содержимого отличается от соотношения сторон страницы.
Crop	Подгоняет содержимое под страницу и обрезает любые части, выходящие за установленные границы страницы.

Подгонка страницы под содержимое SVG при конвертации в JPG

Чтобы подогнать размер страницы выходного изображения под ширину и высоту содержимого, необходимо использовать флаг FitContent, который подгоняет размер страницы под содержимое без масштабирования. Рассмотрим основные шаги:

Загрузите SVG-файл. В примере используется конструктор SVGDocument(documentPath) для загрузки документа SVG из локальной файловой системы.
Создайте экземпляр класса ImageRenderingOption. В этом примере мы устанавливаем SizingType в FitContent, что означает, что размер страницы выходного документа будет соответствовать ширине и высоте содержимого без масштабирования.
Создайте новый экземпляр класса ImageDevice и передайте его в метод RenderTo(device) для конвертации SVG в JPG.

 1using Aspose.Svg.Rendering;
 2using Aspose.Svg.Rendering.Image;
 3using System.IO;
 4...
 5    // Подготовка пути к исходному SVG-файлу
 6    string documentPath = Path.Combine(DataDir, "rendering.svg");
 7
 8    // Подготовка пути для сохранения конвертированного файла
 9    string savePath = Path.Combine(OutputDir, "fitContent.jpg");
10
11    // Создание экземпляра класса SVGDocument
12    using SVGDocument document = new SVGDocument(documentPath);
13
14    // Инициализация объекта ImageRenderingOptions с параметром FitContent
15    ImageRenderingOptions opt = new ImageRenderingOptions(ImageFormat.Jpeg);
16    opt.PageSetup.Sizing = SizingType.FitContent;
17
18    // Создание выходного рендеринг-устройства и конвертация SVG
19    using ImageDevice device = new ImageDevice(opt, savePath);
20    document.RenderTo(device);

Конвертация SVG в JPG привела к получению JPG-документа, в котором размер страницы соответствует содержимому SVG (см. иллюстрацию результатов (b)).

Примечание: При преобразовании SVG в растровый формат, такой как JPG, размер пикселей изображения может измениться из-за различий в разрешении (DPI). SVG является независимым от разрешения, что означает, что его размеры определяются в системе координат, а не в фиксированных пикселях. При конвертации разрешение по умолчанию устанавливается на 300 DPI, тогда как стандартное разрешение экрана составляет 96 DPI. Это приводит к увеличенному выходному изображению, так как размер пикселей масштабируется пропорционально. Например, SVG размером 350 x 350 единиц будет преобразован примерно в 1094 x 1094 пикселя при 300 DPI. Чтобы сохранить исходные размеры, важно указать желаемое разрешение при конвертации.

Во всех примерах в статье используется исходный файл rendering.svg размером 350 x 350 px.

Масштабирование содержимого при рендеринге SVG в JPG

В следующем примере свойство AnyPage устанавливает размер страницы 1500x3000 пикселей, что больше, чем требуется для размещения содержимого SVG-документа. Использование SizingType с флагом ScaleContent масштабирует содержимое SVG так, чтобы оно соответствовало размеру страницы:

 1using Aspose.Svg.Rendering;
 2using Aspose.Svg.Rendering.Image;
 3using Aspose.Svg.Drawing;
 4using System.IO;
 5...
 6    // Подготовка пути к исходному SVG-файлу
 7    string documentPath = Path.Combine(DataDir, "rendering.svg");
 8
 9    // Подготовка пути для сохранения конвертированного файла
10    string savePath = Path.Combine(OutputDir, "scaleContent.png");
11
12    // Создание экземпляра класса SVGDocument
13    using SVGDocument document = new SVGDocument(documentPath);
14
15    // Инициализация объекта ImageRenderingOptions с параметром ScaleContent
16    ImageRenderingOptions opt = new ImageRenderingOptions();
17    opt.PageSetup.AnyPage = new Page(new Drawing.Size(1500, 3000));
18    opt.PageSetup.Sizing = SizingType.ScaleContent;
19
20    // Создание выходного рендеринг-устройства и конвертация SVG
21    using ImageDevice device = new ImageDevice(opt, savePath);
22    document.RenderTo(device);

Конвертация SVG в PNG привела к созданию PNG-изображения размером 1500x3000 пикселей, которое было масштабировано (увеличено) без сохранения пропорций (см. иллюстрацию результатов конверсии (c)).

Масштабирование содержимого с использованием флага `Contain`

Флаг Contain контролирует размер содержимого и позволяет его масштабировать с сохранением соотношения сторон. Содержимое масштабируется до тех пор, пока оно не впишется в ширину или высоту страницы. Следующий пример показывает, как использовать флаг Contain в сочетании с установкой размера страницы 2000x2500 пикселей. Если размер страницы не установлен, результат будет масштабирован и подогнан под формат A4 при рендеринге.

 1using Aspose.Svg.Rendering;
 2using Aspose.Svg.Rendering.Image;
 3using System.IO;
 4...
 5    // Подготовка пути к исходному SVG-файлу
 6    string documentPath = Path.Combine(DataDir, "rendering.svg");
 7
 8    // Подготовка пути для сохранения конвертированного файла
 9    string savePath = Path.Combine(OutputDir, "using-contain.png");
10
11    // Инициализация SVGDocument
12    using SVGDocument document = new SVGDocument(documentPath);
13
14    // Инициализация объекта PdfRenderingOptions с параметром Contain
15    ImageRenderingOptions opt = new ImageRenderingOptions();
16    opt.PageSetup.AnyPage = new Page(new Drawing.Size(2000, 2500));
17    opt.PageSetup.Sizing = SizingType.Contain;
18
19    // Создание выходного рендеринг-устройства и конвертация SVG
20    using ImageDevice device = new ImageDevice(opt, savePath);
21    document.RenderTo(device);

В этом примере свойство AnyPage объекта PageSetup устанавливает новый объект Page с Size 2000x2500 пикселей. Затем мы устанавливаем свойство Sizing объекта PageSetup, включая флаг Contain. Это означает, что содержимое выходного документа будет масштабировано, чтобы соответствовать ширине или высоте страницы, сохраняя его пропорции. В этом примере изображение подогнано по ширине страницы (см. иллюстрацию результатов (d)).

Обрезка SVG при рендеринге в PNG

Чтобы обрезать выходной размер страницы до необходимой ширины и высоты, сначала необходимо задать размер страницы, а затем использовать флаг SizingType.Crop в свойстве Sizing. Если не задать требуемые размеры страницы, по умолчанию будет выбран формат A4.

 1using Aspose.Svg.Rendering;
 2using Aspose.Svg.Rendering.Image;
 3using Aspose.Svg.Drawing;
 4using System.IO;
 5...
 6    // Подготовка пути к исходному SVG-файлу
 7    string documentPath = Path.Combine(DataDir, "rendering.svg");
 8
 9    // Подготовка пути для сохранения конвертированного файла
10    string savePath = Path.Combine(OutputDir, "using-crop.jpg");
11
12    // Инициализация SVGDocument
13    using SVGDocument document = new SVGDocument(documentPath);
14
15    // Инициализация объекта ImageRenderingOptions с параметром Crop
16    ImageRenderingOptions opt = new ImageRenderingOptions(ImageFormat.Jpeg);
17    opt.PageSetup.AnyPage = new Page(new Drawing.Size(500, 500));
18    opt.PageSetup.Sizing = SizingType.Crop;
19
20    // Создание выходного рендеринг-устройства и конвертация SVG
21    using ImageDevice device = new ImageDevice(opt, savePath);
22    document.RenderTo(device);

Иллюстрации результатов рендеринга SVG

На рисунке показаны результаты конвертации файла rendering.svg в форматы PNG и JPG с использованием метода RenderTo() и различных параметров рендеринга, которые контролируют размер страницы выходного документа.

Примечание: Исходное изображение SVG имеет размер 350x350 пикселей.

Текст “Изображение иллюстрирует результаты изменения размера документа”

a) Результат конвертации SVG в PNG с настройками рендеринга по умолчанию – PNG-документ размером с A4-страницу с большим количеством пустого пространства. Отрендеренное изображение на странице A4 растянуто по высоте и ширине примерно в 3 раза, поскольку разрешение по умолчанию составляет 300 dpi.

b) Конвертация SVG в JPG привела к созданию JPG-документа, размер страницы которого соответствует ширине и высоте содержимого. Отрендеренное изображение растянуто примерно в 3 раза по высоте и ширине, так как разрешение по умолчанию составляет 300 dpi.

c) Результат конвертации SVG в PNG с увеличением (масштабированием) без сохранения пропорций.

d) Конвертация SVG в PNG привела к созданию PNG-документа, в котором изображение SVG было масштабировано до ширины выходной страницы с сохранением пропорций.

Заключение

Настройка рендеринга позволяет адаптировать размер страницы к содержимому документа SVG и наоборот.
Использование различных флагов SizingType помогает точно определить стратегию масштабирования или обрезки документа.
Простая интеграция Aspose.SVG for .NET позволяет конвертировать SVG в различные форматы с учетом нужного макета страницы.

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

Как конвертировать файлы SVG – Узнайте, как конвертировать SVG в другие форматы на C#.
Как объединять файлы SVG – Узнайте, как объединять несколько SVG в PDF, XPS или изображения.
Векторизация – Основы – Узнайте, как конвертировать растровые изображения в векторную графику с помощью Aspose.SVG for .NET.

Конвертировать SVG в SVGZ Векторизация изображений и текста