Wie man ein Dokument während der Konvertierung von SVG verkleinert? – C#

In der heutigen Welt sind die meisten Dokumente im A4-Format, aber manchmal hat der aus SVG gerenderte Inhalt eine andere Größe. Dies führt zu viel Leerraum auf der Seite oder der Inhalt passt einfach nicht auf die Seite! In diesem Artikel werden wir betrachten, wie man die Rendering-Optionen verwendet, um die Dokumentseiten auf die Größe des Inhalts und umgekehrt zu verkleinern.

Wie man ein Dokument verkleinert, wenn es mit Aspose.SVG gerendert wird

Der Aspose.Svg.Rendering Namespace bietet eine leistungsstarke Sammlung von Werkzeugen wie Low-Level-Optionsklassen, Schnittstellen und Aufzählungen zum Rendern von SVG-Dokumenten in verschiedene Ausgabeformate wie PDF, XPS und Bilder. Standardmäßig wird SVG in ein Dokument im A4-Format konvertiert, das wahrscheinlich zusätzlichen Leerraum neben dem Bild enthält. Aber manchmal müssen Sie Dokumente zuschneiden, um eine kleinere Seitengröße zu erstellen, die zur Größe des Inhalts passt.

Die PageSetup Klasse bietet eine Reihe von Eigenschaften zur Verwaltung der Seiteneinstellungen für SVG-Dokumente, wenn sie in verschiedene Dateiformate gerendert werden. Lassen Sie uns einige der am häufigsten verwendeten Eigenschaften betrachten:

Seitensetup festlegen. Die AnyPage Eigenschaft ermöglicht es Ihnen, das Seitensetup (Größe, Ränder, Ausrichtung usw.) für jede Seite eines SVG-Dokuments festzulegen, das in ein mehrseitiges Format wie PDF, XPS, PNG, JPG usw. gerendert wird. Verwenden Sie die Page, Size und Margin Klassen, um die Seiteneinstellungen für SVG-Dokumente zu verwalten, wenn sie in verschiedene Dateiformate gerendert werden.
Dokument an die Größe des Inhalts anpassen. Sie können die Seitengröße an den Inhalt anpassen und umgekehrt, indem Sie die Sizing Eigenschaft mit der SizingType Aufzählung verwenden. Diese Eigenschaft ist eine Menge von Bit-Flags, die das Verhalten des Renderers steuern. Sie können Dokumente zuschneiden oder Dokumente skalieren, um ihren Inhalt an die Seitengröße anzupassen.

Sie können die C#-Beispiele in diesem Artikel problemlos verwenden, um SVG in Bilder, PDF und XPS mit einem benutzerdefinierten Seitenlayout zu konvertieren. Die einzigen Unterschiede bestehen darin, dass Sie angeben müssen:

die entsprechenden Rendering-Optionen – ImageRenderingOption, PdfRenderingOption oder XpsRenderingOption;
das entsprechende Ausgabegerät – ImageDevice, PdfDevice oder XpsDevice.

SVG in PNG mit Standard-Rendering-Optionen

Um SVG mit Standard-Rendering-Optionen in PNG zu konvertieren, sollten Sie einige Schritte befolgen:

Verwenden Sie einen der SVGDocument() Konstruktoren, um eine document Instanz zu initialisieren. In den folgenden Beispielen laden wir eine lokale SVG-Datei.
Initialisieren Sie eine Instanz der ImageRenderingOption Klasse, wenn Sie SVG in ein Bilddateiformat konvertieren möchten. Standardmäßig ist das ImageFormat PNG.
Erstellen Sie eine neue Instanz der ImageDevice Klasse. Verwenden Sie den ImageDevice() Konstruktor, der options und den Ausgabepfad savePath als Parameter akzeptiert.
Verwenden Sie die RenderTo(device) Methode, um SVG in PNG zu konvertieren, die das device Objekt als Parameter akzeptiert.

Der folgende C#-Code zeigt ein Beispiel für die Konvertierung eines SVG-Dokuments in ein Bild ohne zusätzliche Optionen, d.h. mit Standard-Rendering-Optionen. Als Ergebnis der Konvertierung wurde ein A4-PNG-Dokument mit viel Leerraum erhalten (siehe Illustrationen der Konversionsergebnisse (a)).

 1using Aspose.Svg.Rendering;
 2using Aspose.Svg.Rendering.Image;
 3using System.IO;
 4...
 5
 6    // Bereiten Sie den Pfad zu einer Quell-SVG-Datei vor
 7    string documentPath = Path.Combine(DataDir, "rendering.svg");
 8
 9    // Bereiten Sie einen Pfad zum Speichern der konvertierten Datei vor
10    string savePath = Path.Combine(OutputDir, "a4.png");
11
12    // Erstellen Sie eine Instanz der SVGDocument-Klasse
13    using SVGDocument document = new SVGDocument(documentPath);
14
15    // Initialisieren Sie ein ImageRenderingOptions-Objekt mit Standardoptionen
16    ImageRenderingOptions opt = new ImageRenderingOptions();
17
18    // Erstellen Sie ein Ausgabegerät und konvertieren Sie SVG
19    using ImageDevice device = new ImageDevice(opt, savePath);
20    document.RenderTo(device);

Rendering-Optionen

Die SizingType Aufzählung des Aspose.Svg.Rendering-Namespace spezifiziert Flags, die zusammen mit anderen PageSetup Optionen verschiedene Strategien zur Anpassung der Seitengröße oder der Inhaltsgröße beim Rendern von SVG-Dokumenten definieren.

Name	Beschreibung
FitContent	Passt die Seitengröße an, um den Inhalt ohne Skalierung anzupassen. Dies stellt sicher, dass alle SVG-Inhalte sichtbar sind, ohne zusätzliche Ränder. Ideal für Dokumente, bei denen der Inhalt die Seitengröße bestimmen soll.
ScaleContent	Skaliert den Inhalt, um in eine vordefinierte Seitengröße zu passen. Das Seitenverhältnis des Inhalts kann geändert werden, um in die angegebenen Abmessungen zu passen. Diese Option ist nützlich, wenn Sie möchten, dass der Inhalt in ein festes Seitenlayout passt.
Contain	Ändert die Größe des Inhalts, um in die Seitenabmessungen zu passen, während das Seitenverhältnis beibehalten wird. Im Gegensatz zu `ScaleContent` stellt diese Methode sicher, dass das Seitenverhältnis intakt bleibt, was zu leeren Bereichen führen kann, wenn das Seitenverhältnis des Inhalts von dem der Seite abweicht.
Crop	Passt den Inhalt auf eine Seite an und schneidet alle Teile ab, die über bestimmte Seitenränder hinausgehen.

Seite an SVG-Inhalt anpassen, wenn SVG in JPG konvertiert wird

Um die Seitengröße des Ausgabebildes an die Breite und Höhe des Inhalts anzupassen, müssen Sie das FitContent-Flag verwenden, das die Seitengröße anpasst, um den Inhalt ohne Skalierung anzupassen. Lassen Sie uns die Schritte betrachten, die Sie befolgen sollten:

Laden Sie eine SVG-Datei. Im Beispiel lädt der SVGDocument(documentPath) Konstruktor das SVG-Dokument von einem lokalen Dateisystem.
Erstellen Sie eine Instanz der ImageRenderingOption Klasse. In diesem Beispiel setzen wir den SizingType auf FitContent, was bedeutet, dass die Seitengröße des Ausgabedokuments an die Breite und Höhe des Inhalts ohne Skalierung angepasst wird.
Erstellen Sie eine neue Instanz der ImageDevice Klasse und übergeben Sie sie an die RenderTo(device) Methode, um SVG in JPG zu konvertieren.

 1using Aspose.Svg.Rendering;
 2using Aspose.Svg.Rendering.Image;
 3using System.IO;
 4...
 5
 6    // Bereiten Sie den Pfad zu einer Quell-SVG-Datei vor
 7    string documentPath = Path.Combine(DataDir, "rendering.svg");
 8
 9    // Bereiten Sie einen Pfad zum Speichern der konvertierten Datei vor
10    string savePath = Path.Combine(OutputDir, "fitContent.jpg");
11
12    // Erstellen Sie eine Instanz der SVGDocument-Klasse
13    using SVGDocument document = new SVGDocument(documentPath);
14
15    // Initialisieren Sie ein ImageRenderingOptions-Objekt mit benutzerdefinierten Optionen. Verwenden Sie das FitContent-Flag
16    ImageRenderingOptions opt = new ImageRenderingOptions(ImageFormat.Jpeg);
17    opt.PageSetup.Sizing = SizingType.FitContent;
18
19    // Erstellen Sie ein Ausgabegerät und konvertieren Sie SVG
20    using ImageDevice device = new ImageDevice(opt, savePath);
21    document.RenderTo(device);

Die SVG-zu-JPG-Konvertierung ergab ein JPG-Dokument mit einer Seitengröße, die zur SVG-Inhaltsgröße passt (siehe Illustrationen der Konversionsergebnisse (b)).

Hinweis: Bei der Konvertierung eines SVG in ein Rasterformat wie JPG kann sich die Pixelgröße des Bildes aufgrund von Unterschieden in der Auflösung (DPI) ändern. SVGs sind auflösungsunabhängig, was bedeutet, dass ihre Abmessungen in einem Koordinatensystem und nicht in festen Pixeln definiert sind. Bei der Konvertierung wird die Standardauflösung auf 300 DPI eingestellt, während die Standardbildschirmauflösung 96 DPI beträgt. Dies führt zu einem größeren Ausgabebild, da die Pixelgrößen proportional skaliert werden. Zum Beispiel wird ein SVG von 350 x 350 Einheiten bei 300 DPI in etwa 1094 x 1094 Pixel konvertiert. Um die ursprünglichen Abmessungen beizubehalten, ist es wichtig, die gewünschte Auflösung bei der Konvertierung anzugeben. Für alle Beispiele im Artikel verwenden wir die Quell-Datei rendering.svg – 350 x 350 px.

Inhalt skalieren beim Rendern von SVG zu JPG

Im folgenden Beispiel setzt die AnyPage Eigenschaft die Seitengröße auf 1500x3000 Pixel, was größer ist als erforderlich, um den Inhalt des SVG-Dokuments aufzunehmen. Die Verwendung von SizingType mit dem ScaleContent-Flag skaliert den SVG-Inhalt, um auf die Seite zu passen:

 1using Aspose.Svg.Rendering;
 2using Aspose.Svg.Rendering.Image;
 3using Aspose.Svg.Drawing;
 4using System.IO;
 5...
 6
 7    // Bereiten Sie den Pfad zu einer Quell-SVG-Datei vor
 8    string documentPath = Path.Combine(DataDir, "rendering.svg");
 9
10    // Bereiten Sie einen Pfad zum Speichern der konvertierten Datei vor
11    string savePath = Path.Combine(OutputDir, "scaleContent.png");
12
13    // Erstellen Sie eine Instanz der SVGDocument-Klasse
14    using SVGDocument document = new SVGDocument(documentPath);
15
16    // Initialisieren Sie ein ImageRenderingOptions-Objekt mit benutzerdefinierten Optionen. Verwenden Sie das ScaleContent-Flag
17    ImageRenderingOptions opt = new ImageRenderingOptions();
18    opt.PageSetup.AnyPage = new Page(new Drawing.Size(1500, 3000));
19    opt.PageSetup.Sizing = SizingType.ScaleContent;
20
21    // Erstellen Sie ein Ausgabegerät und konvertieren Sie SVG
22    using ImageDevice device = new ImageDevice(opt, savePath);
23    document.RenderTo(device);

Die SVG-zu-PNG-Konvertierung ergab ein 1500x3000 PNG-Bild, das ohne Beibehaltung des Seitenverhältnisses skaliert (vergrößert) wurde (siehe die Illustration der Konversionsergebnisse (c)).

Inhalt skalieren mit dem `Contain`-Flag

Das Contain-Flag steuert die Größe des Inhalts und ermöglicht es, ihn zu skalieren, während das Seitenverhältnis beibehalten wird. Der Inhalt wird skaliert, bis er in die Breite oder Höhe der Seite passt. Das folgende Beispiel zeigt, wie das Contain-Flag in Kombination mit der Festlegung einer Seitengröße von 2000x2500 Pixeln verwendet werden kann. Wenn die Seitengröße nicht festgelegt ist, wird das Ergebnis skaliert und passt beim Rendern in das A4-Format.

 1using Aspose.Svg.Rendering;
 2using Aspose.Svg.Rendering.Image;
 3using System.IO;
 4...
 5
 6    // Bereiten Sie den Pfad zu einer Quell-SVG-Datei vor
 7    string documentPath = Path.Combine(DataDir, "rendering.svg");
 8
 9    // Bereiten Sie den Pfad für das Speichern der konvertierten Datei vor 
10    string savePath = Path.Combine(OutputDir, "using-contain.png");
11
12    // Initialisieren Sie SVGDocument
13    using SVGDocument document = new SVGDocument(documentPath);
14
15    // Initialisieren Sie ein PdfRenderingOptions-Objekt mit benutzerdefinierten Optionen. Verwenden Sie das Contain-Flag
16    ImageRenderingOptions opt = new ImageRenderingOptions();
17    opt.PageSetup.AnyPage = new Page(new Drawing.Size(2000, 2500));
18    opt.PageSetup.Sizing = SizingType.Contain;
19
20    // Erstellen Sie ein Ausgabegerät und konvertieren Sie SVG
21    using ImageDevice device = new ImageDevice(opt, savePath);
22    document.RenderTo(device);

Im Beispiel setzt die AnyPage Eigenschaft des PageSetup ein neues Page Objekt mit einer Size von 2000x2500 Pixeln. Dies setzt die Seitengröße auf 2000x2500 Pixel. Dann setzen wir die Sizing Eigenschaft des PageSetup Objekts, um das Contain-Flag einzuschließen. Das bedeutet, dass der Inhalt des Ausgabedokuments so skaliert wird, dass er in die Breite oder Höhe der Seite passt, während seine Proportionen beibehalten werden. In diesem Beispiel passt das Bild in die Breite der Seite (siehe die Illustration der Konversionsergebnisse (d).).

SVG in PNG gerendertes Ergebnis zuschneiden

Um die Ausgabeseitengröße auf die erforderliche Breite und Höhe zuzuschneiden, müssen Sie zuerst die Seitengröße festlegen und dann das SizingType.Crop-Flag in der Sizing Eigenschaft festlegen. Wenn Sie die erforderlichen Seitenabmessungen nicht festlegen, wird standardmäßig die A4-Größe gewählt.

 1using Aspose.Svg.Rendering;
 2using Aspose.Svg.Rendering.Image;
 3using Aspose.Svg.Drawing;
 4using System.IO;
 5...
 6
 7    // Bereiten Sie den Pfad zu einer Quell-SVG-Datei vor
 8    string documentPath = Path.Combine(DataDir, "rendering.svg");
 9
10    // Bereiten Sie einen Pfad zum Speichern der konvertierten Datei vor
11    string savePath = Path.Combine(OutputDir, "using-crop.jpg");
12
13    // Initialisieren Sie SVGDocument
14    using SVGDocument document = new SVGDocument(documentPath);
15
16    // Initialisieren Sie ein ImageRenderingOptions-Objekt mit benutzerdefinierten Optionen. Verwenden Sie das Crop-Flag
17    ImageRenderingOptions opt = new ImageRenderingOptions(ImageFormat.Jpeg);
18    opt.PageSetup.AnyPage = new Page(new Drawing.Size(500, 500));
19    opt.PageSetup.Sizing = SizingType.Crop;
20
21    // Erstellen Sie ein Ausgabegerät und konvertieren Sie SVG
22    using ImageDevice device = new ImageDevice(opt, savePath);
23    document.RenderTo(device);

Abbildungen der Konversionsergebnisse

Die Abbildung zeigt die Ergebnisse der Konvertierung der rendering.svg Datei in PNG- und JPG-Formate unter Verwendung der RenderTo() Methode und verschiedener Rendering-Optionen, die die Seitengröße des Ausgabedokuments steuern.

Hinweis: Das Quell-SVG-Bild hat eine Größe von 350x350 Pixeln.

Text “Das Bild veranschaulicht die Ergebnisse der Dokumentverkleinerung”

a) Das Ergebnis der Konvertierung von SVG in PNG mit Standard-Rendering-Optionen ist ein PNG-Dokument in der Größe einer A4-Seite mit viel Leerraum. Das gerenderte Bild auf einer A4-Seite wird in Höhe und Breite um etwa das 3-fache gestreckt, da die Standardauflösung 300 dpi beträgt.

b) Die Konvertierung des SVG in JPG ergab ein JPG-Dokument mit einer Seitenbreite und -höhe, die zur Inhaltsbreite und -höhe passten. Das gerenderte Bild wird in Höhe und Breite um etwa das 3-fache gestreckt, da die Standardauflösung 300 dpi beträgt.

c) Das Ergebnis der Konvertierung von SVG in PNG mit Skalierung (Vergrößerung) ohne Beibehaltung der Proportionen.

d) Die SVG-zu-PNG-Konvertierung ergab ein PNG-Dokument, in dem das SVG-Bild so skaliert wurde, dass es in die Breite der Ausgabeseite passt, während das Seitenverhältnis des Bildes beibehalten wurde.

Siehe auch

Wie man SVG-Dateien konvertiert – Sie erfahren, wie Sie SVG in andere Formate in C# konvertieren, finden C#-Codebeispiele und probieren einen Online-Konverter für SVG aus.
Wie man SVG-Dateien zusammenführt – Sie erfahren, wie Sie mehrere SVG in PDF, XPS oder Bildformate mit der Render() Methode zusammenführen und finden C#-Beispiele für das Zusammenführen von SVGs.
Vektorisierung – Grundlegende Übersicht – Die Artikel in diesem Abschnitt erklären, wie man Rasterbilder in Vektorgrafiken mit der Aspose.SVG für .NET API konvertiert.

So konvertieren Sie SVG-Dateien So ändern Sie die SVG-Farbe