Jak konwertować pliki SVG do formatu PDF przy użyciu języka C#

Konwersja SVG do PDF w C

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

IronPDF konwertuje grafikę SVG na dokumenty PDF przy użyciu metody HTML do PDF — osadź swój plik SVG w tagu img z wyraźnymi stylami height, aby zapewnić prawidłowe renderowanie.

IronPDF obsługuje renderowanie grafik SVG do dokumentów PDF poprzez metodę HTML do PDF. Pliki SVG (Scałable Vector Graphics) są szeroko stosowane do logotypów, ikon, ilustracji i wykresów z powodu ich skalowalności i ostrości renderowania w dowolnym rozmiarze. Konwersja SVG do PDF jest niezbędna do tworzenia dokumentów gotowych do druku, celów archiwalnych oraz zapewnienia spójnego wyświetlania na różnych platformach.

Uwaga: Podczas osadzania pliku SVG należy ustawić atrybut stylu width i/lub height elementu img — w przeciwnym razie może on zostać zredukowany do rozmiaru zerowego i nie pojawić się w wyrenderowanym pliku PDF.

Szybki start: Łatwa konwersja SVG do PDF

Konwertuj pliki SVG do PDF używając IronPDF w C#. Ten fragment kodu pokazuje osadzanie pliku SVG za pomocą tagu HTML img z określonymi wymiarami, co jest kluczowym krokiem dla pomyślnego renderowania. Postępuj wg tego przewodnika, aby szybko wdrożyć rozwiązanie, które zapewnia dokładne renderowanie i zapisywanie SVG jako PDF.

  1. Install IronPDF with NuGet Package Manager

    PM > Install-Package IronPdf
  2. Skopiuj i uruchom ten fragment kodu.

    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. Wdrożenie do testowania w środowisku produkcyjnym

    Rozpocznij używanie IronPDF w swoim projekcie już dziś z darmową wersją próbną

    arrow pointer

Jak renderować SVG do PDF z odpowiednimi rozmiarami?

Wiele przeglądarek toleruje SVG bez specyfikacji rozmiaru; jednak nasz silnik renderujący ich wymaga. Silnik renderujący Chrome używany przez IronPDF wymaga wyraźnych wymiarów, aby prawidłowo renderować elementy SVG. Bez określonych wymiarów SVG może nie pojawić się w końcowym PDF lub zostać zrenderowany z nieoczekiwanymi rozmiarami.

Pracując z SVG w IronPDF, masz kilka opcji zapewnienia poprawnego renderowania:

  1. Wbudowany plik SVG z atrybutami stylu: Dodaj width i height bezpośrednio w atrybucie stylu
  2. Zewnętrzne pliki SVG: Odnośniki do plików SVG przez URL lub lokalną ścieżkę pliku
  3. Base64 Kodowane SVG: Osadź SVG bezpośrednio w HTML jako ciągi Base64

Dla bardziej zaawansowanych opcji renderowania HTML zobacz nasz szczegółowy przewodnik na temat opcji renderowania.

: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");
Imports IronPdf

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

Private renderer As New ChromePdfRenderer()
renderer.RenderingOptions.WaitFor.RenderDelay(1000)

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

Jak wygląda wygenerowany plik PDF?

Dodatkowo lub alternatywnie węzeł SVG może mieć przypisane jawne atrybuty width i height. Zobacz także przykłady stylizacji SVG na CodePen.

Przykład renderowania SVG do PDF

Praca z lokalnymi plikami SVG

Przy konwersji lokalnych plików SVG do PDF użyj podejścia ze ścieżką pliku. Ta metoda dobrze działa z zasobami SVG przechowywanymi w Twoim projekcie:

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");
Imports IronPdf
Imports System.IO

' Load SVG file content
Dim svgPath As String = "C:\assets\company-logo.svg"
Dim svgContent As String = File.ReadAllText(svgPath)

' Create HTML with embedded SVG
Dim html As String = $"
<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
Dim renderer As New ChromePdfRenderer()
renderer.RenderingOptions.MarginTop = 10
renderer.RenderingOptions.MarginBottom = 10
renderer.RenderingOptions.PrintHtmlBackgrounds = True

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

Kodowanie Base64 dla osadzonych SVG

Dla scenariuszy wymagających bezpośredniego osadzania danych SVG w HTML bez odniesień do zewnętrznych plików, kodowanie Base64 zapewnia niezawodne rozwiązanie. To podejście jest szczegółowo wyjaśnione w naszym przewodniku osadzanie obrazów:

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");
Imports IronPdf
Imports System
Imports System.Text

' SVG content as string
Dim svgContent As String = "<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
Dim svgBytes As Byte() = Encoding.UTF8.GetBytes(svgContent)
Dim base64Svg As String = Convert.ToBase64String(svgBytes)

' Create HTML with Base64 embedded SVG
Dim html As String = $"
<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
Dim renderer As New ChromePdfRenderer()
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(html)
pdf.SaveAs("embedded-svg.pdf")
$vbLabelText   $csharpLabel

Najlepsze praktyki konwersji SVG do PDF

1. Zawsze określ wymiary

Najczęstszym problemem przy konwersji SVG do PDF jest brak lub zerowe wymiary. Zawsze upewnij się, że elementy SVG mają wyraźne wartości width i height. Dla responsywnych projektów rozważ użycie ustawień viewport do kontroli układu PDF.

2. Obsługuj złożone SVG z opóźnieniami renderowania

Złożone pliki SVG z animacjami lub JavaScriptem mogą wymagać dodatkowego czasu renderowania. Użyj opcji RenderDelay, aby zapewnić pełne renderowanie:

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

Dla zaawansowanej obsługi JavaScript, zapoznaj się z naszym przewodnikiem renderowania JavaScript.

3. Optymalizuj pliki SVG

Przed konwersją optymalizuj swoje pliki SVG poprzez:

  • Usuwanie niepotrzebnych metadanych
  • Upraszczanie ścieżek
  • Konwertowanie tekstu na ścieżki dla spójnego renderowania
  • Używanie odpowiedniej kompresji

4. Testuj kompatybilność międzyplatformową

Renderowanie SVG może się różnić w zależności od systemu operacyjnego. Testuj swoje konwersje na:

Rozwiązywanie typowych problemów z SVG

SVG nie pojawia się w PDF

Jeśli Twój SVG nie pojawia się w generowanym PDF:

  1. Zweryfikuj, czy wymiary są ustawione poprawnie
  2. Sprawdź, czy ścieżki plików lub URL-e są dostępne
  3. Upewnij się, że odpowiedni MIME typ dla plików SVG jest używany
  4. Przejrzyj nasz przewodnik pixel-perfect rendering

Problemy ze skalowaniem i rozdzielczością

Dla wysokiej jakości renderowania SVG w różnych skalach:

// 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);' />";
' Set custom DPI for better quality
renderer.RenderingOptions.DPI = 300

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

Renderowanie czcionek w SVG

Gdy SVG zawierają elementy tekstowe, upewnij się, że czcionki są prawidłowo osadzone. Dowiedz się więcej o zarządzaniu czcionkami i wsparciu web font.

Zaawansowane techniki konwersji SVG

Batch processing wielu SVG

Dla konwersji wielu plików SVG do jednego dokumentu 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");
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");
Imports IronPdf
Imports System.Collections.Generic
Imports System.Text

Dim svgFiles As New List(Of String) From {
    "chart1.svg",
    "chart2.svg",
    "diagram.svg"
}

Dim htmlBuilder As New StringBuilder()
htmlBuilder.Append("<html><body>")

For Each svgFile As String In svgFiles
    htmlBuilder.Append($"
        <div style='page-break-after:always;'>
            <img src='{svgFile}' style='width:600px;height:400px;' />
        </div>")
Next

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

Dim renderer As New ChromePdfRenderer()
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(htmlBuilder.ToString())
pdf.SaveAs("multiple-svgs.pdf")
$vbLabelText   $csharpLabel

Dla bardziej szczegółowych informacji o pracy z wieloma stronami, zobacz nasz przewodnik scałania i dzielenia PDF.

Gotowy, aby sprawdzić, co jeszcze możesz zrobić? Sprawdź nasze strony z samouczkami: Dodatkowe funkcje. Możesz również dowiedzieć się, jak dodać nagłówki i stopki do swoich PDF zawierających SVG lub poznać niestandardowe znaki wodne do brandingu dokumentów.

  • Użyj TextAnnotation i AddTextAnnotation

Często Zadawane Pytania

Jak przekonwertowac SVG na PDF w C#?

IronPDF konwertuje SVG na PDF za pomocą metody HTML to PDF. Po prostu osadź swój SVG w znaczniku img HTML z wyraźnie określonymi stylami szerokości i wysokości, a następnie użyj IronPDF's ChromePdfRenderer do renderowania HTML jako PDF. Kluczem jest zapewnienie poprawnych atrybutów rozmiaru na elemencie img.

Dlaczego moj SVG nie pojawia się w PDF?

SVG mogą nie pojawiać się w PDFach generowanych przez IronPDF, jeśli brakuje im wyraźnych specyfikacji szerokości i wysokości. Używany przez IronPDF silnik renderowania Chrome wymaga ustawionych wymiarów przez atrybuty stylu lub atrybuty szerokości / wysokości na znaczniku img. Bez tego, SVG może się zapaść do zera.

Jakie są różne metody osadzania SVG dla konwersji PDF?

IronPDF wspiera trzy główne metody osadzania SVG: 1) SVG osadzony inline z atrybutami stylów dla szerokości i wysokości, 2) Pliki SVG zewnętrzne odwoływane przez URL lub lokalną ścieżkę pliku, oraz 3) Kody SVG zakodowane w base64 osadzane bezpośrednio w HTML. Wszystkie metody wymagają poprawnych specyfikacji rozmiarów.

Czy mogę konwertować lokalne pliki SVG na PDF?

Tak, IronPDF może konwertować lokalne pliki SVG na PDF. Użyj podejścia ścieżki pliku, odwołując się do swoich zasobów SVG przechowywanych w projekcie poprzez atrybut src znacznika img. Pamiętaj, aby zawierać specyfikacje szerokości i wysokości dla prawidłowego renderowania.

Jakie opcje renderowania powinien używać dla konwersji SVG na PDF?

Podczas konwertowania SVG na PDF za pomocą IronPDF, użyj ChromePdfRenderer z odpowiednimi RenderingOptions. Powszechnym podejściem jest dodanie RenderDelay używając WaitFor.RenderDelay(1000) do zapewnienia pełnego załadunku SVG przed konwersją. Pomaga to w przypadku złożonych SVG lub podczas ładowania zasobów zewnętrznych.

Jak zapisac przekonwertowany SVG jako plik PDF?

Po wyrenderowaniu swego HTML zawierającego SVG za pomocą IronPDF's ChromePdfRenderer, użyj metody SaveAs do zapisania pliku PDF. Wystarczy wywołać SaveAs("filename.pdf") na renderowanym obiekcie PDF, aby zapisać go w określonej lokalizacji.

Curtis Chau
Autor tekstów technicznych

Curtis Chau posiada tytuł licencjata z informatyki (Uniwersytet Carleton) i specjalizuje się w front-endowym rozwoju, z ekspertką w Node.js, TypeScript, JavaScript i React. Pasjonuje się tworzeniem intuicyjnych i estetycznie przyjemnych interfejsów użytkownika, Curtis cieszy się pracą z nowoczesnymi frameworkami i tworzeniem dobrze zorganizowanych, atrakcyjnych wizualnie podrę...

Czytaj więcej
Gotowy, aby rozpocząć?
Nuget Pliki do pobrania 18,926,724 | Wersja: 2026.5 just released
Still Scrolling Icon

Wciąż przewijasz?

Czy chcesz szybko dowodu? PM > Install-Package IronPdf
Uruchom przykład i zobacz, jak Twój kod HTML zamienia się w plik PDF.