1. IronPDF
  2. Anleitungen
  3. SVG-Grafiken
Wie SVGs zu PDF mit C# konvertieren

SVG in C#35 in PDF konvertieren

Curtis Chau
Curtis Chau
Aktualisiert:
This article was translated from English: Does it need improvement?
Translated
View the article in English

IronPDF konvertiert SVG-Grafiken in PDF-Dokumente, indem es den HTML-zu-PDF-Ansatz verwendet - betten Sie Ihr SVG in ein img-Tag mit expliziten Breiten-/Höhenstilen ein, um eine korrekte Darstellung zu gewährleisten.

IronPDF unterstützt das Rendern von SVG-Grafiken in PDF-Dokumente über die HTML-to-PDF-Methode. SVG-Dateien (Scalable Vector Graphics) werden aufgrund ihrer Skalierbarkeit und gestochen scharfen Darstellung bei jeder Größe häufig für Logos, Symbole, Illustrationen und Diagramme verwendet. Die Konvertierung von SVGs in PDFs ist für die Erstellung druckfertiger Dokumente, für Archivierungszwecke und zur Gewährleistung einer konsistenten Darstellung auf verschiedenen Plattformen unerlässlich.

Hinweis: Legen Sie das Stilattribut Breite und/oder Höhe des img-Elements fest, wenn Sie eine SVG einbetten - andernfalls kann es passieren, dass sie auf eine Größe von Null zusammenfällt und nicht in der gerenderten PDF-Datei erscheint.

als-Überschrift:2(Schnellstart: Mühelose SVG zu PDF-Konvertierung)

Konvertieren von SVG-Dateien in PDF mit IronPDF in C#. Dieses Snippet zeigt, wie ein SVG über ein HTML-img-Tag mit festgelegten Abmessungen eingebettet wird, ein entscheidender Schritt für erfolgreiches Rendering. Befolgen Sie diesen Leitfaden für eine schnelle Implementierung, die sicherstellt, dass Ihre SVGs korrekt gerendert und als PDF-Dateien gespeichert werden.

Nuget IconLegen Sie jetzt mit NuGet los, um PDFs zu erstellen:

  1. Installieren Sie IronPDF mit dem NuGet-Paketmanager.

    PM > Install-Package IronPdf

  2. Kopieren Sie diesen Codeausschnitt und führen Sie ihn aus.

    new IronPdf.ChromePdfRenderer { RenderingOptions = { WaitFor = IronPdf.Rendering.WaitFor.RenderDelay(1000) } }
    .RenderHtmlAsPdf("<img src='https://example.com/logo.svg' style='width:100px;height:100px;'>")
    .SaveAs("svgToPdf.pdf");

  3. Bereitstellen zum Testen in Ihrer Live-Umgebung

    Beginnen Sie noch heute mit der Nutzung von IronPDF in Ihrem Projekt – mit einer kostenlosen Testversion.
    arrow pointer

Minimaler Arbeitsablauf (5 Schritte)

  1. Installation der IronPDF-Bibliothek für die Konvertierung von SVG in PDF
  2. Verwendung des img-Tags in HTML zum Importieren von SVG-Bildern
  3. Verwenden Sie verschiedene Renderverfahren in IronPDF, um PDF zu erzeugen
  4. Speichern Sie die PDF-Datei mit dem SVG-Bild mit der Methode SaveAs
  5. Überprüfen Sie die PDF-Datei am angegebenen Ort

Wie rendere ich SVG in PDF mit korrekter Größe?

Viele Browser tolerieren SVGs ohne Größenangaben; unsere Rendering-Engine benötigt sie jedoch. Die von IronPDF verwendete Chrome-Rendering-Engine benötigt explizite Abmessungen, um SVG-Elemente korrekt darzustellen. Wenn die Abmessungen nicht angegeben werden, kann es sein, dass die SVG in der endgültigen PDF-Datei nicht angezeigt wird oder eine unerwartete Größe aufweist.

Bei der Arbeit mit SVGs in IronPDF haben Sie mehrere Möglichkeiten, um eine korrekte Darstellung zu gewährleisten:

  1. Inline SVG mit Stilattributen: Breite und Höhe direkt in das Style-Attribut einfügen
  2. Externe SVG-Dateien: Verweis auf SVG-Dateien über URL oder lokalen Dateipfad
  3. Base64 kodierte SVGs: SVGs direkt in HTML als Base64-Strings einbetten

Weitere fortgeschrittene HTML-Rendering-Optionen finden Sie in unserem umfassenden Leitfaden zu Rendering-Optionen.

:path=/static-assets/pdf/content-code-examples/how-to/SVGs-render.cs
using IronPdf;

string html = "<img src='https://ironsoftware.com/img/svgs/new-banner-svg.svg' style='width:100px'>";

ChromePdfRenderer renderer = new ChromePdfRenderer();
renderer.RenderingOptions.WaitFor.RenderDelay(1000);

PdfDocument pdf = renderer.RenderHtmlAsPdf(html);
pdf.SaveAs("svgToPdf.pdf");
$vbLabelText   $csharpLabel

Wie sieht die generierte PDF-Datei aus?

Zusätzlich oder alternativ kann ein SVG-Knoten explizite Breite- und Höhe-Attribute zugewiesen bekommen. Siehe auch Beispiele für SVG-Styling auf CodePen.

Beispiel zum Rendern von SVG in PDF

Arbeiten mit lokalen SVG-Dateien

Verwenden Sie bei der Konvertierung lokaler SVG-Dateien in PDF den Dateipfad-Ansatz. Diese Methode funktioniert gut mit SVG-Assets, die in Ihrem Projekt gespeichert sind:

using IronPdf;
using System.IO;

// Load SVG file content
string svgPath = @"C:\assets\company-logo.svg";
string svgContent = File.ReadAllText(svgPath);

// Create HTML with embedded SVG
string html = $@"
<html>
<head>
    <style>
        body {{ margin: 20px; }}
        .logo {{ width: 200px; height: 100px; }}
    </style>
</head>
<body>
    <h1>Company Report</h1>
    <img src='file:///{svgPath}' class='logo' />
    <p>Annual financial summary with vector graphics.</p>
</body>
</html>";

// Configure renderer with custom settings
ChromePdfRenderer renderer = new ChromePdfRenderer();
renderer.RenderingOptions.MarginTop = 10;
renderer.RenderingOptions.MarginBottom = 10;
renderer.RenderingOptions.PrintHtmlBackgrounds = true;

// Generate PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);
pdf.SaveAs("report-with-svg.pdf");
using IronPdf;
using System.IO;

// Load SVG file content
string svgPath = @"C:\assets\company-logo.svg";
string svgContent = File.ReadAllText(svgPath);

// Create HTML with embedded SVG
string html = $@"
<html>
<head>
    <style>
        body {{ margin: 20px; }}
        .logo {{ width: 200px; height: 100px; }}
    </style>
</head>
<body>
    <h1>Company Report</h1>
    <img src='file:///{svgPath}' class='logo' />
    <p>Annual financial summary with vector graphics.</p>
</body>
</html>";

// Configure renderer with custom settings
ChromePdfRenderer renderer = new ChromePdfRenderer();
renderer.RenderingOptions.MarginTop = 10;
renderer.RenderingOptions.MarginBottom = 10;
renderer.RenderingOptions.PrintHtmlBackgrounds = true;

// Generate PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);
pdf.SaveAs("report-with-svg.pdf");
$vbLabelText   $csharpLabel

Base64-Kodierung für eingebettete SVGs

Für Szenarien, die direkt in HTML eingebettete SVG-Daten ohne externe Dateiverweise erfordern, bietet die Base64-Kodierung eine zuverlässige Lösung. Dieser Ansatz wird in unserem Leitfaden zum Einbetten von Bildern ausführlich erläutert:

using IronPdf;
using System;

// SVG content as string
string svgContent = @"<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'>
    <circle cx='50' cy='50' r='40' stroke='black' stroke-width='2' fill='red' />
</svg>";

// Convert to Base64
byte[] svgBytes = System.Text.Encoding.UTF8.GetBytes(svgContent);
string base64Svg = Convert.ToBase64String(svgBytes);

// Create HTML with Base64 embedded SVG
string html = $@"
<html>
<body>
    <h2>Embedded SVG Example</h2>
    <img src='data:image/svg+xml;base64,{base64Svg}' style='width:150px;height:150px;' />
</body>
</html>";

// Render to PDF
ChromePdfRenderer renderer = new ChromePdfRenderer();
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);
pdf.SaveAs("embedded-svg.pdf");
using IronPdf;
using System;

// SVG content as string
string svgContent = @"<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'>
    <circle cx='50' cy='50' r='40' stroke='black' stroke-width='2' fill='red' />
</svg>";

// Convert to Base64
byte[] svgBytes = System.Text.Encoding.UTF8.GetBytes(svgContent);
string base64Svg = Convert.ToBase64String(svgBytes);

// Create HTML with Base64 embedded SVG
string html = $@"
<html>
<body>
    <h2>Embedded SVG Example</h2>
    <img src='data:image/svg+xml;base64,{base64Svg}' style='width:150px;height:150px;' />
</body>
</html>";

// Render to PDF
ChromePdfRenderer renderer = new ChromePdfRenderer();
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);
pdf.SaveAs("embedded-svg.pdf");
$vbLabelText   $csharpLabel

Best Practices für die Konvertierung von SVG in PDF

1. Geben Sie immer die Abmessungen an

Das häufigste Problem bei der Konvertierung von SVGs in PDF sind fehlende oder fehlende Abmessungen. Stellen Sie immer sicher, dass Ihre SVG-Elemente explizite Werte für Breite und Höhe haben. Für responsive Designs sollten Sie Blickfeldeinstellungen verwenden, um das PDF-Layout zu steuern.

2. komplexe SVGs mit Rendering-Verzögerungen handhaben

Komplexe SVG-Dateien mit Animationen oder JavaScript können zusätzliche Rendering-Zeit erfordern. Verwenden Sie die Option RenderDelay, um ein vollständiges Rendering zu gewährleisten:

renderer.RenderingOptions.WaitFor.RenderDelay(2000); // Wait 2 seconds
renderer.RenderingOptions.WaitFor.RenderDelay(2000); // Wait 2 seconds
$vbLabelText   $csharpLabel

Für den Umgang mit JavaScript für Fortgeschrittene empfehlen wir unseren JavaScript Rendering Guide.

3. optimiere SVG-Dateien

Optimieren Sie Ihre SVG-Dateien vor der Konvertierung durch:

  • Entfernen von unnötigen Metadaten
  • Vereinfachung der Pfade
  • Konvertierung von Text in Pfade für konsistentes Rendering
  • Geeignete Komprimierung verwenden

4. plattformübergreifende Kompatibilität testen

Die SVG-Darstellung kann von Betriebssystem zu Betriebssystem unterschiedlich sein. Testen Sie Ihre Konvertierungen auf:

Fehlerbehebung bei häufigen SVG-Problemen

SVG wird in PDF nicht angezeigt

Wenn Ihr SVG nicht in der generierten PDF-Datei erscheint:

  1. Überprüfen Sie, ob die Abmessungen korrekt eingestellt sind
  2. Überprüfen Sie, ob Dateipfade oder URLs zugänglich sind
  3. Sicherstellung des richtigen MIME-Typs für SVG-Dateien
  4. Lesen Sie unseren Leitfaden für pixelgenaues Rendering

Skalierungs- und Auflösungsprobleme

Für hochwertiges SVG-Rendering in verschiedenen Maßstäben:

// Set custom DPI for better quality
renderer.RenderingOptions.DPI = 300;

// Use CSS transforms for scaling
string html = @"
<img src='logo.svg' style='width:200px;height:200px;transform:scale(1.5);' />";
// Set custom DPI for better quality
renderer.RenderingOptions.DPI = 300;

// Use CSS transforms for scaling
string html = @"
<img src='logo.svg' style='width:200px;height:200px;transform:scale(1.5);' />";
$vbLabelText   $csharpLabel

Schriftwiedergabe in SVGs

Wenn SVGs Textelemente enthalten, muss sichergestellt werden, dass die Schriftarten richtig eingebettet sind. Erfahren Sie mehr über Schriftartenverwaltung und Webschriftartenunterstützung.

Fortgeschrittene SVG-Konvertierungstechniken

Batch-Verarbeitung mehrerer SVGs

Für die Konvertierung mehrerer SVG-Dateien in ein einziges PDF-Dokument:

using IronPdf;
using System.Collections.Generic;
using System.Text;

List<string> svgFiles = new List<string> 
{
    "chart1.svg",
    "chart2.svg",
    "diagram.svg"
};

StringBuilder htmlBuilder = new StringBuilder();
htmlBuilder.Append("<html><body>");

foreach(string svgFile in svgFiles)
{
    htmlBuilder.Append($@"
        <div style='page-break-after:always;'>
            <img src='{svgFile}' style='width:600px;height:400px;' />
        </div>");
}

htmlBuilder.Append("</body></html>");

ChromePdfRenderer renderer = new ChromePdfRenderer();
PdfDocument pdf = renderer.RenderHtmlAsPdf(htmlBuilder.ToString());
pdf.SaveAs("multiple-svgs.pdf");
using IronPdf;
using System.Collections.Generic;
using System.Text;

List<string> svgFiles = new List<string> 
{
    "chart1.svg",
    "chart2.svg",
    "diagram.svg"
};

StringBuilder htmlBuilder = new StringBuilder();
htmlBuilder.Append("<html><body>");

foreach(string svgFile in svgFiles)
{
    htmlBuilder.Append($@"
        <div style='page-break-after:always;'>
            <img src='{svgFile}' style='width:600px;height:400px;' />
        </div>");
}

htmlBuilder.Append("</body></html>");

ChromePdfRenderer renderer = new ChromePdfRenderer();
PdfDocument pdf = renderer.RenderHtmlAsPdf(htmlBuilder.ToString());
pdf.SaveAs("multiple-svgs.pdf");
$vbLabelText   $csharpLabel

Weitere Informationen zur Arbeit mit mehreren Seiten finden Sie in unserem Leitfaden zum Zusammenführen oder Teilen von PDFs.

Bereit zu sehen, was Sie sonst noch tun können? Sehen Sie sich hier unsere Tutorial-Seite an: Zusätzliche Funktionen. Sie können auch herausfinden, wie Sie Kopf- und Fußzeilen zu Ihren SVG-haltigen PDFs hinzufügen oder sich über angepasste Wasserzeichen für das Branding Ihrer Dokumente informieren.

  • Verwenden Sie TextAnnotation und AddTextAnnotation

Häufig gestellte Fragen

Wie kann ich SVG in C# in PDF konvertieren?

IronPDF konvertiert SVG in PDF mithilfe der HTML-zu-PDF-Methode. Sie betten Ihr SVG einfach in ein HTML-img-Tag mit expliziten Breiten- und Höhenstilen ein und verwenden dann den ChromePdfRenderer von IronPDF, um das HTML als PDF zu rendern. Wichtig ist, dass die richtigen Größenattribute für das img-Element festgelegt werden.

Warum wird meine SVG-Datei nicht in der PDF-Datei angezeigt?

SVGs können in von IronPDF generierten PDFs nicht angezeigt werden, wenn sie keine expliziten Breiten- und Höhenangaben enthalten. Die von IronPDF verwendete Chrome-Rendering-Engine verlangt, dass die Abmessungen entweder über Style-Attribute oder Width/Height-Attribute am img-Tag festgelegt werden. Ohne diese Attribute kann das SVG auf eine Größe von Null zusammenfallen.

Welche verschiedenen Methoden gibt es zum Einbetten von SVGs für die PDF-Konvertierung?

IronPDF unterstützt drei Hauptmethoden zum Einbetten von SVGs: 1) Inline-SVGs mit Stilattributen für Breite und Höhe, 2) externe SVG-Dateien, auf die über eine URL oder einen lokalen Dateipfad verwiesen wird, und 3) Base64-kodierte SVGs, die direkt in HTML eingebettet sind. Bei allen Methoden müssen die Größenangaben korrekt sein.

Kann ich lokale SVG-Dateien in PDF konvertieren?

Ja, IronPDF kann lokale SVG-Dateien in PDF konvertieren. Verwenden Sie den Dateipfad-Ansatz, indem Sie über das src-Attribut des img-Tags auf Ihre in Ihrem Projekt gespeicherten SVG-Assets verweisen. Vergessen Sie nicht, die Angaben zu Breite und Höhe für eine korrekte Darstellung anzugeben.

Welche Rendering-Optionen sollte ich für die Konvertierung von SVG in PDF verwenden?

Wenn Sie SVG mit IronPDF in PDF konvertieren, verwenden Sie den ChromePdfRenderer mit den entsprechenden RenderingOptions. Ein gängiger Ansatz ist es, mit WaitFor.RenderDelay(1000) eine Renderverzögerung hinzuzufügen, um sicherzustellen, dass SVGs vor der Konvertierung vollständig geladen werden. Dies ist hilfreich bei komplexen SVGs oder beim Laden externer Ressourcen.

Wie speichere ich die konvertierte SVG-Datei als PDF-Datei?

Nachdem Sie Ihr SVG-haltiges HTML mit dem ChromePdfRenderer von IronPDF gerendert haben, verwenden Sie die SaveAs-Methode, um die PDF-Datei zu speichern. Rufen Sie einfach SaveAs("Dateiname.pdf") für das gerenderte PDF-Objekt auf, um es an dem von Ihnen angegebenen Ort zu speichern.

Curtis Chau
Curtis Chau
  Jetzt mit dem Ingenieurteam chatten
Technischer Autor

Curtis Chau hat einen Bachelor-Abschluss in Informatik von der Carleton University und ist spezialisiert auf Frontend-Entwicklung mit Expertise in Node.js, TypeScript, JavaScript und React. Leidenschaftlich widmet er sich der Erstellung intuitiver und ästhetisch ansprechender Benutzerschnittstellen und arbeitet gerne mit modernen Frameworks sowie der Erstellung gut strukturierter, optisch ansprechender ...

Weiterlesen
Bereit anzufangen?
Nuget Downloads 17,012,929 | Version: 2025.12 gerade veröffentlicht