SVG avec image à l’intérieur en C# | PNG en SVG | JPG en SVG

Scalable Vector Graphics (SVG) est un format d’image puissant qui peut être utilisé pour créer des images évolutives de haute qualité pour le Web. Les images SVG sont créées à l’aide du code XML, ce qui les rend faciles à créer et à modifier. Dans certains cas, nous pouvons avoir besoin d’intégrer des ressources telles que des images PNG ou JPG dans SVG. Dans cet article de blog, nous allons vous montrer comment créer un SVG avec une image à l’intérieur en utilisant C#.

Cet article couvre les sujets suivants :

  1. API C# pour créer du SVG avec une image à l’intérieur
  2. Intégrer PNG dans SVG
  3. Intégrer SVG dans SVG
  4. Obtenez une licence gratuite
  5. Ressources d’apprentissage gratuites

API C# pour créer du SVG avec une image à l’intérieur

Nous utiliserons Aspose.SVG for .NET pour créer un SVG avec une image à l’intérieur. Il permet aux développeurs de travailler avec des fichiers SVG dans des applications .NET. L’API permet de charger, analyser, restituer, créer et convertir des fichiers SVG en formats populaires sans dépendances logicielles.

Veuillez télécharger la DLL de l’API ou l’installer à l’aide de NuGet.

PM> Install-Package Aspose.SVG

Intégrer PNG dans SVG en utilisant C#

Nous pouvons facilement intégrer des images bitmap dans un objet SVG en utilisant le SVG <image> élément. Le SVG<image> est capable de restituer des images dans différents formats, tels que les graphiques JPEG, PNG et même SVG. Les attributs du <image> L'élément définit comment le bitmap doit être affiché. Les principaux attributs incluent :

  • x et y : ceux-ci désignent les coordonnées du coin supérieur gauche de l’image.
  • largeur et hauteur : Celles-ci déterminent la largeur et la hauteur de la « fenêtre » dans laquelle l’image sera affichée. Ces deux attributs sont obligatoires.
  • href et xlink:href : ces attributs pointent vers l’URL du fichier image.
  • préserverAspectRatio : cet attribut régit la manière dont l’image est mise à l’échelle proportionnellement.

Nous pouvons facilement créer un SVG avec un PNG à l’intérieur en suivant les étapes ci-dessous :

  1. Spécifiez le contenu SVG sous forme de chaîne.
  2. Après cela, créez une instance de la classe SVGDocument à partir du contenu de la chaîne.
  3. Enfin, enregistrez l’image à l’aide de la méthode Save().

L’exemple de code suivant montre comment intégrer une image PNG dans un SVG à l’aide de C#.

// Spécifiez le contenu SVG avec une image PNG intégrée.
string content = "<svg height=\"500\" width=\"600\" xmlns=\"http://www.w3.org/2000/svg\">\r\n    " +
                "<circle cx=\"120\" cy=\"100\" r=\"90\" style=\"fill:blue; stroke-width:3; stroke:rgb(0,0,0); fill-opacity:0.7\"  />" +
                "<image href=\"https://www.aspose.cloud/templates/aspose/App_Themes/V3/images/svg/272x272/aspose_svg-for-net.png\" x=\"70\" y=\"50\" height=\"100\" width=\"100\" />\r\n    \t" +
                "<text x=\"40\" y=\"250\">Embedded PNG image</text>\r\n    \t" +
        "</svg>";

// Initialisez un document SVG à l'aide de SVGDocument.
SVGDocument document = new SVGDocument(content, ".");

// Enregistrez le document dans un fichier avec l'énumération SVGSaveFormat.
document.Save("C:\\Files\\EmbedPNG.svg", SVGSaveFormat.SVG);
Intégrer PNG dans SVG en utilisant C#

Intégrez PNG dans SVG en utilisant C#.

Intégrer SVG dans SVG en utilisant C#

De même, nous pouvons créer un SVG avec une image SVG à l’intérieur en suivant les étapes mentionnées précédemment.

L’exemple de code suivant montre comment intégrer une image SVG dans un SVG à l’aide de C#.

// Spécifiez le contenu SVG avec une image SVG intégrée.
string documentContent = "<svg height=\"500\" width=\"500\" xmlns=\"http://www.w3.org/2000/svg\">\r\n\t" +
        "<image href=\"https://docs.aspose.com/svg/net/navigation-inspection/shapes.svg\" x=\"250\" y=\"10\" height=\"350\" width=\"350\" />\r\n    \t" +
        "<text x=\"300\" y=\"250\">Embedded SVG image</text>    \r\n" +
    "</svg>";

// Initialisez un document SVG à l'aide de SVGDocument.
SVGDocument document = new SVGDocument(documentContent, ".");

// Enregistrez le document dans un fichier avec l'énumération SVGSaveFormat.
document.Save("C:\\Files\\EmbedSVG.svg", SVGSaveFormat.SVG);
Intégrer SVG dans SVG en utilisant C#

Intégrez SVG dans SVG en utilisant C#.

Obtenez une licence gratuite

Vous pouvez obtenir une licence temporaire gratuite pour essayer Aspose.SVG for .NET sans limitations d’évaluation.

SVG avec image à l’intérieur – Ressources gratuites

Vous pouvez en savoir plus sur les différentes fonctionnalités de la bibliothèque en utilisant les ressources ci-dessous :

Conclusion

En conclusion, créer des images SVG avec des images intégrées à l’aide de C# est un processus relativement simple. En suivant les étapes de ce didacticiel, vous pouvez créer vos propres images SVG personnalisées qui pourront être utilisées sur votre site Web ou dans vos applications. En tirant parti d’Aspose.SVG for .NET, une bibliothèque SVG puissante et polyvalente, vous pouvez facilement créer des images SVG avec des images intégrées pouvant être utilisées sur n’importe quel appareil. En cas d’ambiguïté, n’hésitez pas à nous contacter sur notre forum d’assistance gratuit.

Voir également