GcImaging supports SVG (Scalable Vector Graphics) image file format which allows you to render vector images at any size without loss of quality.
The GcSvgDocument class is provided in the GrapeCity.Documents.Svg namespace in the GcImaging library. This class allows you to create, load, inspect, modify and save the internal structure of an SVG image.
SVG graphics can be loaded from files or strings into the object model of GcSvgDocument class, further drawn to the GcGraphics class to effectively output the result to GcPdfDocument, GcBitmap or GcWicBitmap classes. SVG documents can be drawn to objects derived from GcGraphics, such as GcPdfGraphics or GcBitmapGraphics using the GcGraphics.DrawSvg method overloads.
To render an SVG image to a PNG image and output the result to GcBitmap class:
C# |
Copy Code
|
---|---|
using var svg = GcSvgDocument.FromFile("Smiling-Girl.svg"); var rect = svg.Measure(PointF.Empty); float factor = 1.5f; using var bmp = new GcBitmap((int)(rect.Width * factor + 0.95f), (int)(rect.Height * factor + 0.95f), true, 96f * factor, 96f * factor); using (var g = bmp.CreateGraphics(Color.White)) { g.DrawSvg(svg, new PointF(-rect.X, -rect.Y)); } bmp.SaveAsPng("Smiling-Girl.png"); |
Similarly as above, use the following code to render an SVG image to a PNG image and output the result to GcWicBitmap class:
C# |
Copy Code
|
---|---|
using var svg = GcSvgDocument.FromFile("Smiling-Girl.svg"); var rect = svg.Measure(PointF.Empty); float factor = 1.5f; using var bmp = new GcWicBitmap((int)(rect.Width * factor + 0.95f), (int)(rect.Height * factor + 0.95f), true, 96f * factor, 96f * factor); using (var g = bmp.CreateGraphics(Color.White)) { g.DrawSvg(svg, new PointF(-rect.X, -rect.Y)); } bmp.SaveAsPng("Smiling-Girl.png"); |
The output of above code snippets will look like below:
You can also render an SVG image to a PDF document. For more information, refer Images topic in GcPdf docs.
GcImaging lets you render graphics and text on a GcSVGDocument by using ToSvgDocument method of the GcSvgGraphics class. This class is derived from the GcGraphics class.
C# |
Copy Code
|
---|---|
using var g = new GcSvgGraphics(800, 600); g.DrawRoundRect(new RectangleF(5, 5, 790, 590), 20, Color.Blue, 2, DashStyle.DashDot); var tl = g.CreateTextLayout(); tl.Append("Hello World!", new TextFormat() { ForeColor = Color.SandyBrown, FontSize = 50f, FontName = "Segoe UI", }); g.Transform = Matrix3x2.CreateRotation(30 * (float)Math.PI / 180) * Matrix3x2.CreateTranslation(100, 50); g.DrawTextLayout(tl, PointF.Empty); var rect = new RectangleF(0, 0, 300, 200); g.Transform = Matrix3x2.CreateRotation(-30 * (float)Math.PI / 180) * Matrix3x2.CreateTranslation(400, 400); g.FillEllipse(rect, new HatchBrush(HatchStyle.Backslashes) { ForeColor = Color.MediumPurple }); g.DrawEllipse(rect, new Pen(Color.Red, 3)); using var svg = g.ToSvgDocument(); svg.Save("GcImagingRenderToSVG.svg", new XmlWriterSettings() { Indent = true }); |
Limitation
Text is always rendered as graphics using paths. Hence, resulting .svg files for text pages are large and it is not possible to select or copy text on the SVG images opened in the browsers.
GcImaging lets you save a newly created SVG document or a modified document as a file or a stream. You can use the GcSvgDocument.Save method to serialize the new or modified SVG document to a file or a stream.
C# |
Copy Code
|
---|---|
using var svg = GcSvgDocument.FromFile("cerdito.svg"); var paint = new SvgPaint(Color.Bisque); foreach (var elem in svg.GetElementsByClass("rose")) { elem.Fill = paint; } svg.Save("cerdito2.svg", new XmlWriterSettings() { Indent = true }); File.WriteAllBytes("cerdito2.svgz", svg.ToSvgz()); |
Limitations