Convert Text to SVG in C# | C# SVG Library | SVG Text in C#

SVG-Text-CSharp.md

Learn how to convert text to SVG in C# : https://blog.aspose.com/svg/convert-text-to-svg-in-csharp/

The following topics are covered in this article:

1. C# API to Convert Text to SVG
2. What is SVG Text?
3. Convert Text to SVG
4. Convert Text with tspan to SVG
5. SVG Text with textPath
6. Apply SVG Text Styles

SVG-Text-CSharp_ApplyStyle.cs

// This code example demonstrates how to add text to SVG and apply CSS style attributes.
var document = new SVGDocument();

// Get root svg element of the document
var svgElement = document.RootElement;

const string @namespace = "http://www.w3.org/2000/svg";

// Define SVG Text element
var text = (SVGTextElement)document.CreateElementNS(@namespace, "text");

// Define text to show
text.TextContent = "The is a simple SVG text!";

// Set various attributes
text.SetAttribute("fill", "blue");
text.SetAttribute("x", "10");
text.SetAttribute("y", "30");

// Apply Style
text.SetAttribute("style", "font-weight:bold; font-style: italic; text-decoration: line-through; text-transform: capitalize;");

// Append text to the root
svgElement.AppendChild(text);

// Save as SVG
document.Save(@"C:\Files\text-style.svg");

SVG-Text-CSharp_Convert.cs

// This code example demonstrates how to add text to SVG.
var document = new SVGDocument();

// Get root svg element of the document
var svgElement = document.RootElement;

const string @namespace = "http://www.w3.org/2000/svg";

// Define SVG Text element
var text = (SVGTextElement)document.CreateElementNS(@namespace, "text");

// Define text to show
text.TextContent = "The is a simple SVG text!";

// Set various attributes
text.SetAttribute("fill", "blue");
text.SetAttribute("x", "10");
text.SetAttribute("y", "30");

// Append text to the root
svgElement.AppendChild(text);

// Save as SVG
document.Save(@"C:\Files\simple-text.svg");

SVG-Text-CSharp_textPath.cs

// This code example demonstrates how to add text with textPath to SVG.
var document = new SVGDocument();

// Get root svg element of the document
var svgElement = document.RootElement;

const string @namespace = "http://www.w3.org/2000/svg";

// SVG Path element
var path1 = (SVGPathElement)document.CreateElementNS(@namespace, "path");
path1.SetAttribute("id", "path_1");
path1.SetAttribute("d", "M 50 100 Q 25 10 180 100 T 350 100 T 520 100 T 690 100");
path1.SetAttribute("fill", "transparent");

// Append SVG Path to root element
svgElement.AppendChild(path1);

// Another SVG Path element
var path2 = (SVGPathElement)document.CreateElementNS(@namespace, "path");
path2.SetAttribute("id", "path_2");
path2.SetAttribute("d", "M 50 100 Q 25 10 180 100 T 350 100");
path2.SetAttribute("transform", "translate(0,75)");
path2.SetAttribute("fill", "transparent");

// Append SVG Path to root element
svgElement.AppendChild(path2);

// SVG Text Element
var text = (SVGTextElement)document.CreateElementNS(@namespace, "text");

// Create SVG Text Path element
var textPath1 = (SVGTextPathElement)document.CreateElementNS(@namespace, "textPath");
textPath1.TextContent = "Aspose.SVG for .NET is flexible library for SVG files processing and fully compatible with its specifications.";
textPath1.SetAttribute("href", "#path_1");

// Append SVG Text Path to SVG Text
text.AppendChild(textPath1);

// Another SVG Text Path element
var textPath2 = (SVGTextPathElement)document.CreateElementNS(@namespace, "textPath");
textPath2.TextContent = "Aspose.SVG for .NET is flexible library for SVG files processing and fully compatible with its specifications.";
textPath2.SetAttribute("href", "#path_2");

// Append SVG Text Path to SVG Text
text.AppendChild(textPath2);

// Append SVG Text to root
svgElement.AppendChild(text);

// Save the SVG
document.Save(@"C:\Files\svg-textPath.svg");

SVG-Text-CSharp_tspan.cs

// This code example demonstrates how to add text with tspan to SVG.
var document = new SVGDocument();

// Get root svg element of the document
var svgElement = document.RootElement;

const string @namespace = "http://www.w3.org/2000/svg";

// SVG Text element
var text = (SVGTextElement)document.CreateElementNS(@namespace, "text");
text.SetAttribute("style", "font-family:arial");
text.SetAttribute("x", "20");
text.SetAttribute("y", "60");

// SVG TSpan element
var tspan1 = (SVGTSpanElement)document.CreateElementNS(@namespace, "tspan");
tspan1.TextContent = "ASPOSE";
tspan1.SetAttribute("style", "font-weight:bold; font-size:55px");
tspan1.SetAttribute("x", "20");
tspan1.SetAttribute("y", "60");

// Appen to SVG Text
text.AppendChild(tspan1);

// Another TSpan element
var tspan2 = (SVGTSpanElement)document.CreateElementNS(@namespace, "tspan");
tspan2.TextContent = "Your File Format APIs";
tspan2.SetAttribute("style", "font-size:20px; fill:grey");
tspan2.SetAttribute("x", "37");
tspan2.SetAttribute("y", "90");

// Append to SVG Text
text.AppendChild(tspan2);

// Append SVG Text to root
svgElement.AppendChild(text);

// Save the SVG
document.Save(@"C:\Files\svg-tSpan.svg");