1. IronPDF
  2. Guides pratiques
  3. Graphiques SVG
Comment convertir des SVG en PDF en utilisant C#

Convertir SVG en PDF en C#35;

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

IronPDF convertit les graphiques SVG en documents PDF en utilisant l'approche HTML vers PDF - intégrez votre SVG dans une balise img avec des styles de largeur/hauteur explicites pour assurer un rendu correct.

IronPDF prend en charge le rendu des graphiques SVG dans les documents PDF via la méthode HTML to PDF. Les fichiers SVG (Scalable Vector Graphics) sont largement utilisés pour les logos, les icônes, les illustrations et les graphiques en raison de leur évolutivité et de la netteté du rendu quelle que soit la taille. La conversion des SVG en PDF est essentielle pour créer des documents prêts à imprimer, à des fins d'archivage et pour garantir un affichage cohérent sur différentes plateformes.

Remarque : définissez l'attribut de style width et/ou height de l'élément img lors de l'intégration d'un SVG - sinon, il risque de se réduire à une taille nulle et de ne pas apparaître dans le PDF rendu.

<TODO : Ajouter une image ici -->

en-tête:2(Guidage rapide : Conversion de SVG en PDF sans effort)

Convertir des fichiers SVG en PDF à l'aide d'IronPDF en C#. Ce fragment de code démontre l'intégration d'un SVG via une balise HTML img avec des dimensions spécifiées, une étape cruciale pour un rendu réussi. Suivez ce guide pour une mise en œuvre rapide qui garantit que vos SVG sont correctement rendus et enregistrés en tant que PDF.

Nuget IconCommencez dès maintenant à créer des PDF avec NuGet :

  1. Installez IronPDF avec le gestionnaire de packages NuGet

    PM > Install-Package IronPdf

  2. Copiez et exécutez cet extrait de code.

    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. Déployez pour tester sur votre environnement de production.

    Commencez à utiliser IronPDF dans votre projet dès aujourd'hui grâce à un essai gratuit.
    arrow pointer

Flux de travail minimal (5 étapes)

  1. Installer la bibliothèque IronPDF pour la conversion de SVG en PDF
  2. Utiliser la balise img en HTML pour importer une image SVG
  3. Utiliser différentes méthodes de rendu dans IronPDF pour générer un PDF
  4. Enregistrer le fichier PDF contenant l'image SVG avec la méthode SaveAs
  5. Vérifier le PDF dans l'emplacement spécifié

Comment rendre SVG en PDF avec des dimensions correctes?

De nombreux navigateurs tolèrent les SVG sans spécification de taille ; cependant, notre moteur de rendu en a besoin. Le moteur de rendu Chrome utilisé par IronPDF nécessite des dimensions explicites pour rendre correctement les éléments SVG. Si les dimensions ne sont pas spécifiées, le SVG risque de ne pas apparaître dans le PDF final ou de s'afficher avec des dimensions inattendues.

Lorsque vous travaillez avec des SVG dans IronPDF, vous disposez de plusieurs options pour garantir un rendu correct :

  1. SVG en ligne avec les attributs de style : Ajouter la largeur et la hauteur directement dans l'attribut de style
  2. <Fichiers SVG externes : Référencement de fichiers SVG via une URL ou un chemin d'accès local
  3. SVG codés en Base64 : incorporez les SVG directement dans le HTML sous forme de chaînes Base64

Pour des options de rendu HTML plus avancées, consultez notre guide complet sur les options de rendu.

: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

À quoi ressemble le PDF généré?

De plus, ou alternativement, un nœud SVG peut avoir un attribut de largeur et de hauteur explicite assigné. Voir aussi exemples de style SVG sur CodePen.

Exemple de rendu SVG en PDF

<TODO : Ajouter une image ici -->

Travailler avec des fichiers SVG locaux

Lors de la conversion de fichiers SVG locaux en PDF, utilisez l'approche du chemin de fichier. Cette méthode fonctionne bien avec les actifs SVG stockés dans votre projet :

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

Codage Base64 pour les SVG intégrés

Pour les scénarios nécessitant des données SVG intégrées directement dans HTML sans références de fichiers externes, l'encodage Base64 constitue une solution fiable. Cette approche est expliquée en détail dans notre guide sur l'intégration d'images :

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

Bonnes pratiques pour la conversion de SVG en PDF

1. Précisez toujours les dimensions

Le problème le plus courant lors de la conversion de SVG en PDF est l'absence ou le manque de dimensions. Veillez toujours à ce que vos éléments SVG aient des valeurs de largeur et de hauteur explicites. Pour les conceptions réactives, pensez à utiliser viewport settings pour contrôler la mise en page du PDF.

2. gérer les SVG complexes avec des retards de rendu

Les fichiers SVG complexes contenant des animations ou du JavaScript peuvent nécessiter un temps de rendu supplémentaire. Utilisez l'option RenderDelay pour garantir un rendu complet :

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

Pour une manipulation avancée de JavaScript, explorez notre Guide de rendu JavaScript.

3. optimiser les fichiers SVG

Avant la conversion, optimisez vos fichiers SVG en :

  • Suppression des métadonnées inutiles
  • Simplifier les chemins
  • Conversion du texte en chemins pour un rendu cohérent
  • Utilisation d'une compression appropriée

4. tester la compatibilité multiplateforme

Le rendu SVG peut varier d'un système d'exploitation à l'autre. Testez vos conversions sur :

Dépannage des problèmes SVG courants

Le SVG n'apparaît pas dans le PDF

Si votre SVG n'apparaît pas dans le PDF généré :

  1. Vérifier que les dimensions sont correctement définies
  2. Vérifier que les chemins d'accès aux fichiers ou les URL sont accessibles
  3. Assurer le type MIME approprié pour les fichiers SVG
  4. Consultez notre guide du rendu parfait au pixel près

Problèmes de mise à l'échelle et de résolution

Pour un rendu SVG de haute qualité à différentes échelles :

// 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

Rendu des polices dans les SVG

Lorsque les SVG contiennent des éléments textuels, veillez à ce que les polices soient correctement intégrées. En savoir plus sur la gestion des polices et la prise en charge des polices web.

<TODO : Ajouter une image ici -->

Techniques avancées de conversion SVG

Traitement par lots de plusieurs SVG

Pour convertir plusieurs fichiers SVG en un seul document 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");
$vbLabelText   $csharpLabel

Pour plus d'informations sur le travail avec plusieurs pages, consultez notre guide sur la fusion ou la division de PDF.

Prêt à voir ce que vous pouvez faire d'autre? Consultez notre page de didacticiels ici : Fonctionnalités supplémentaires. Vous pouvez également découvrir comment ajouter des en-têtes et des pieds de page à vos PDF contenant du SVG ou vous renseigner sur les filigranes personnalisés pour donner une image de marque à vos documents.

  • Utilisez TextAnnotation et AddTextAnnotation

Questions Fréquemment Posées

Comment convertir un fichier SVG en PDF en C# ?

IronPDF convertit les SVG en PDF en utilisant la méthode HTML vers PDF. Il suffit d'intégrer votre SVG dans une balise HTML img avec des styles de largeur et de hauteur explicites, puis d'utiliser le ChromePdfRenderer d'IronPDF pour rendre le HTML sous forme de PDF. La clé est de s'assurer que les attributs de dimensionnement appropriés sont définis sur l'élément img.

Pourquoi mon SVG n'apparaît-il pas dans le PDF ?

Les SVG peuvent ne pas apparaître dans les PDF générés par IronPDF s'ils ne comportent pas de spécifications explicites en matière de largeur et de hauteur. Le moteur de rendu Chrome utilisé par IronPDF exige que les dimensions soient définies soit par des attributs de style, soit par des attributs de largeur/hauteur sur la balise img. Sans ces attributs, le SVG risque de se réduire à une taille nulle.

Quelles sont les différentes méthodes d'intégration des SVG pour la conversion PDF ?

IronPDF prend en charge trois méthodes principales pour intégrer des SVG : 1) SVG en ligne avec des attributs de style pour la largeur et la hauteur, 2) fichiers SVG externes référencés via une URL ou un chemin de fichier local, et 3) SVG encodés en Base64 intégrés directement dans le HTML. Toutes les méthodes requièrent des spécifications de taille appropriées.

Puis-je convertir des fichiers SVG locaux en PDF ?

Oui, IronPDF peut convertir des fichiers SVG locaux en PDF. Utilisez l'approche du chemin de fichier en référençant vos actifs SVG stockés dans votre projet par le biais de l'attribut src de la balise img. N'oubliez pas d'inclure les spécifications de largeur et de hauteur pour un rendu correct.

Quelles options de rendu dois-je utiliser pour la conversion de SVG en PDF ?

Lors de la conversion de SVG en PDF avec IronPdf, utilisez le ChromePdfRenderer avec les RenderingOptions appropriées. Une approche courante consiste à ajouter un délai de rendu en utilisant WaitFor.RenderDelay(1000) pour s'assurer que les SVG se chargent complètement avant la conversion. Cela est utile pour les SVG complexes ou lors du chargement de ressources externes.

Comment puis-je enregistrer le SVG converti en fichier PDF ?

Après avoir rendu votre HTML contenant du SVG avec le ChromePdfRenderer d'IronPDF, utilisez la méthode SaveAs pour enregistrer le fichier PDF. Il suffit d'appeler SaveAs("filename.pdf") sur l'objet PDF rendu pour l'enregistrer à l'emplacement spécifié.

Curtis Chau
Curtis Chau
  Discutez maintenant avec l'équipe d'ingénierie
Rédacteur technique

Curtis Chau détient un baccalauréat en informatique (Université de Carleton) et se spécialise dans le développement front-end avec expertise en Node.js, TypeScript, JavaScript et React. Passionné par la création d'interfaces utilisateur intuitives et esthétiquement plaisantes, Curtis aime travailler avec des frameworks modernes ...

Lire la suite
Prêt à commencer?
Nuget Téléchargements 17,012,929 | Version : 2025.12 vient de sortir