Aspose.SVG.Drawing.SkiaSharp 25.6.0

High-Performance SVG Manipulation and Conversion API

Full Aspose.SVG engine, compiled with SkiaSharp for cross-platform, hardware-accelerated SVG rendering and conversion.

Aspose.SVG.Drawing.SkiaSharp is a cross-platform .NET library that brings powerful SVG processing, DOM manipulation, rendering, and conversion capabilities directly into your applications – without relying on third-party rendering or modeling tools. It provides full support for the official SVG specification, enabling developers to confidently create, modify, and manage SVG content.

Aspose.SVG.Drawing.SkiaSharp delivers the complete Aspose.SVG for .NET API in a single assembly linked against SkiaSharp instead of GDI+. No extra configuration or “extension module” is required just reference the NuGet package and start working.

Written in managed C#, the library works seamlessly with C#, VB.NET, F#, or any other .NET language. It targets .NET Standard 2.0 and runs reliably on Windows, Linux, macOS, Mono, and modern .NET runtimes, including .NET Core, .NET 5, 6, and 7.

SVG Document Creation and Loading

• Create an Empty SVG Document – Instantiate an empty SVG document using the SVGDocument() constructor for full control from the ground up.
• Load SVG from Memory, Stream, or File – The SVGDocument class has a wide set of overloaded constructors allowing you to create a blank document or load it from a file, URL, stream, etc.
• Create SVG with Builder API – Use the SVG Builder API to programmatically construct and configure SVG elements with precision and efficiency.
• Async Load with Resources – Asynchronously load SVG with external resources using the OnReadyStateChange event handler.

SVG Document Editing and Modification

• Add Elements to SVG – Use CreateElementNS() and InsertBefore() to programmatically insert new SVG elements into the document.
• Draw Basic Shapes – Add geometric primitives like <circle>, <rect>, and <line> to create custom vector graphics.
• Edit Existing SVG Documents – Edit SVG elements in the DOM to change styles, positions, and other properties, or use Element Builders, a powerful technique for programmatically editing SVG.
• Edit SVG Paths – Access and update complex path definitions with full control over curves, lines, and commands using the path API.

SVG Builder API

• SVGElementBuilder – Create and configure SVG elements like <rect>, <circle>, <text>, and more using a fluent, chainable syntax for faster and cleaner SVG creation.
• Path Builder – Define complex vector paths programmatically with precision using a structured API for path commands.
• Paint Builder – Easily apply fill, stroke, gradients, and opacity settings to SVG elements, allowing fine control over styling and visual appearance.

SVG Document Navigation and Inspection

• DOM-Based Navigation – Traverse the SVG structure using familiar DOM methods such as DocumentElement, GetElementsByTagName(), and node relationships to explore and manipulate content.
• Element Inspection – Access and extract detailed information from individual SVG elements using DOM properties.
• CSS Selectors – Select and edit elements using CSS selector syntax to apply styles or make targeted changes through the API.
• XPath Queries – Use powerful XPath expressions to locate and interact with nodes in the SVG document for advanced search and inspection tasks.

SVG Conversion and Rendering

• Convert SVG to PDF, XPS, and images – Convert SVG files to formats like PDF, XPS, PNG, JPEG, TIFF, WEBP, or GIF using SkiaSharp’s high-performance, hardware-accelerated rendering pipeline – complete with support for advanced filters, shaders, and image-processing effects.
• Convert SVG to SVGZ and Back – Choose between compressed (SVGZ) and uncompressed (SVG) formats using the SVGSaveFormat enumeration in the Aspose.Svg.Saving namespace.
• Advanced Rendering Options – Fine-tune rendering with settings such as resolution, protection, background color, and page size using ImageRenderingOptions, PdfRenderingOptions, or XpsRenderingOptions, depending on your output format.

Image Vectorization and SVG Optimization

• Image Vectorization – Convert raster images such as PNG, JPG, GIF, TIFF, ICO, and BMP into clean, scalable vector graphics using the ImageVectorizer class.
• Image Stencil Effects – Generate stylized, stencil-like visuals from images during vectorization for creative or technical uses.
• Text Vectorization – Convert text nodes into path elements to preserve appearance, prevent text editing, and maintain crisp rendering at any zoom level.
• SVG Optimization – Optimize SVG files by removing redundant elements, attributes, and metadata to reduce file size and improve performance.

Advanced SVG Features

• Merge Multiple SVGs – Combine multiple SVG documents into a single file using the Render() method and save the result as PDF, XPS, or Image.
• Apply SVG Transformations – Transform individual or grouped SVG elements with rotation, scaling, translation, and skewing using the transform attribute or transformation matrices.
• SVG Filters – Apply SVG filters like Gaussian blur, drop shadow, color saturation, and more through code.
• SVG Gradients – Create and apply smooth color transitions using linear and radial gradients to enrich SVG graphics with dynamic color effects.
• SVG Text and Fonts – Manipulate text using SVG-specific tags like <text>, <tspan>, and apply glyphs and fonts.
• Custom Configuration – Create and apply custom configuration settings for runtime services, web requests, and more.
• Logging and Message Handlers – Implement detailed logging and monitor network requests or errors using customizable message handlers like LogMessageHandler for enhanced diagnostics and debugging.

Supported File Formats

System Requirements

Aspose.SVG.Drawing.SkiaSharp requires no third-party software to create, manipulate, and render SVG documents, as it includes its own document generation engine. It supports development on Windows (including Azure), macOS (10.12+), and Linux (various distributions), and is compatible with .NET Standard 2.0, making it usable across .NET Framework 4.6.1+, .NET Core 2.0+, .NET 5.0+, and modern .NET versions. Developers can use it within Microsoft Visual Studio 2010 through 2022.

Getting Started

To add Aspose.SVG.Drawing.SkiaSharp to your project, run the following command in the Package Manager Console in Visual Studio:

Install-Package Aspose.SVG.Drawing.SkiaSharp

To update to the latest version, use:

Update-Package Aspose.SVG.Drawing.SkiaSharp

This ensures you have the most recent features, enhancements, and fixes. For more information and API reference, visit the Aspose.SVG for .NET documentation.

Add New SVG Elements Using SVG Builder

Aspose.SVG SVG Builder API employs the Fluent Builder Pattern, a design methodology that aligns perfectly with the need for simplicity, clarity, and versatility in SVG manipulation. The following example is an elegant approach to editing an existing document - adding new elements to it:

// Initialize an SVG document
using (SVGDocument document = new SVGDocument("circles.svg"))
{
    // Create a new <g> (group) element using SVGGElementBuilder and set attributes
    SVGGElement gElement = new SVGGElementBuilder()
        .Fill(Paint.None).Stroke(Color.FromArgb(80, 132, 132)).StrokeWidth(10)

        // Add <circle> and <polyline> element configurations
        .AddCircle(c => c.Cx(350).Cy(70).R(50))
        .AddPolyline(points: new double[] { 125, 130, 275, 180, 425, 130 })
        .Build(document);

    // Append the newly created <g> element to the root <svg> element
    document.RootElement.AppendChild(gElement);

    // Save the document
    document.Save("circles--edited.svg");
}

Source – Element Builders – Create and Edit SVG Elements

Convert SVG to PDF

Quickly convert SVG files to PDF, XPS, or images using the Aspose.SVG for .NET API. A simple solution for rendering high-quality PDF from SVG document:

// Initialize an SVG document from a file
using (SVGDocument document = new SVGDocument("document.svg"))
{
    // Initialize an instance of the PdfSaveOptions class
    PdfSaveOptions saveOptions = new PdfSaveOptions();

    // Convert SVG to PDF
    Converter.ConvertSVG(document, saveOptions, "document.pdf");
}

Source – Convert SVG to PDF

Convert SVG to PNG Using Rendering Options

Learn how to create SVG paths using the Aspose.SVG for .NET API. Add and customize path elements with attributes for precision in rendering vector graphics.

// Create an instance of the ImageRenderingOptions class
ImageRenderingOptions options = new ImageRenderingOptions
{
    UseAntialiasing = true,
    Text =
    {
        UseHinting = true
    }
};

// Initialize an SVG Document from a file
using (SVGDocument doc = new SVGDocument("image.svg"))

// Create an ImageDevice object
using (ImageDevice device = new ImageDevice(options, "image.png"))
{
    // Rendering SVG to PNG
    doc.RenderTo(device);
}

Source – Convert SVG to Images

Drop Shadow Effect Using SVG Builder

Create SVG filters to implement various visual effects using either DOM manipulation or SVG Builder. The following code uses SVG Builder to create an SVG document with a text shadow effect:

// Initialize an SVG document
using (SVGDocument document = new SVGDocument())
{
    // Create an instance of SVGSVGElementBuilder to facilitate the construction of the <svg> element and its child elements
    SVGSVGElement svg = new SVGSVGElementBuilder()
        .AddDefs(d => d
            .AddFilter(f => f.Id("shadow").Width(150).Height(150)
                .AddFeDropShadow(sh => sh
                    .Dx(3).Dy(3)
                    .StdDeviation(3)
                    .FloodColor(Color.LightCoral)
                )
            )
        )
        .AddText(t => t.X(20).Y(100).Fill(Color.CornflowerBlue).FontSize(48, LengthType.Pt)
            .Filter(f => f.FilterId("shadow"))
            .AddContent("Drop Shadow Effect")
        )
        
        // Call the Build() method on the SVGSVGElementBuilder to construct the <svg> element with its child elements
        .Build(document.FirstChild as SVGSVGElement);
    document.Save("drop-shadow-effect.svg");
}

Source – Drop Shadow – SVG Filters

Vectorize Image – Convert Raster Image to Vector Graphic

Implement the image vectorization process and work with various pre-processing options for images before saving them in vector format:

// Initialize an instance of the ImageVectorizer class
ImageVectorizer vectorizer = new ImageVectorizer
{
    // Optionally set configuration
    Configuration =
    {
        // Optionally set path builder
        PathBuilder = new BezierPathBuilder {

        // Optionally set trace smoother
        TraceSmoother = new ImageTraceSmoother(2),
        },
        ColorsLimit = 10,
        LineWidth = 1
    }
};
// Vectorize image from the specified file
using SVGDocument document = vectorizer.Vectorize("flower.png");

// Save the vectorized image as an SVG file
document.Save("flower.svg");

Source – Image Vectorization

Tags

SVG Creation | SVG Conversion | SVG Manipulation | Vector Graphics | Image Vectorization | Text Vectorization | SVG Optimization | SVG to PDF | SVG to PNG | Image Conversion | Rendering Options | Custom Configuration | CSS Selector | XPath Navigation | SVG Filters | SVG Gradients | SVG Transformations | Advanced SVG Features | SVG to XPS | Document Merging | SVG Builder API | High-Quality Rendering | Bitmap Rendering | Path Builder | PDF Export | SVG Document Navigation | Logging and Message Handlers | Image Formats