Click here to Skip to main content
15,885,435 members
Articles / Programming Languages / C#
Article

An SVG framework in C# and an SVG-GDI+ bridge

Rate me:
Please Sign up or sign in to vote.
4.70/5 (28 votes)
8 Mar 20032 min read 431K   19.7K   85   57
Svg.Net is a C# framework for creating SVG images. A GDI-SVG bridge is implemented on top of it.

SvgNet & SvgGdi

SvgNet is a C# library designed to facilitate the processing and particularly the creation of SVG documents in C#.
The project homepage is here. Source on the homepage may be more recent than The Code Project copy.

What it does

SvgNet consists of the following parts:

Classes to represent SVG elements and SVG types

SvgNet contains a family of classes that represent SVG elements (e.g. ellipse or tspan) and SVG types (e.g. a transformation list, a style, or a path description). The SVG types are provided with operators to make constructing and modifying SVG documents easy. For example, to change some properties of a style you can do:
myEllipse.Style = new Style("fill:red");
myEllipse.Style.Set("opacity", 0.5);
myEllipse.Style += "stroke:black";

Classes to read, write and copy SVG scenes

To get an SVG string from a tree of SVG elements you have created is as simple as this:
SvgElement myRootElement = SvgFactory.ReadSvgString(s);
s = myRootElement.WriteSvgString(); 
XML output can use entities to reduce the size and increase the legibility of the document.

The SvgFactory class also contains methods to make a deep copy of any SVG node and its descendants. All SVG types and elements are cloneable.

The Svg-Gdi bridge

The SvgGdi bridge is a set of classes that use SvgNet to translate between SVG and GDI+. What this means is that any code that uses GDI+ to draw graphics can easily output SVG as well, simply by plugging in the SvgGraphics object. This object is exactly the same as a regular .NET Graphics object, but creates an SVG tree. Even things like hatched fills and line anchors are implemented. The irritatingly old-fashioned 'current transformation' system of GDI+ is implemented by creating nested SVG group elements, resulting in SVG output that's a bit cleaner than the corresponding GDI+ metafile in some ways.

SvgGdi is the main use for SvgNet, although other things (a collection of basic shapes, maybe charting tools) may be built on SvgNet in the future.

Documentation

The SvgNet class libraries are documented in this help package. Additionally, there are two example applications bundled with SvgNet:
  • SvgDocTest -- test application that reads and writes documents and constructs an SVG document. This application is both an example and test system.
  • SvgGdiTest -- application that draws various scenes with SVG and GDI+. It is both an example of SvgGdi use, and a test of how accurate SvgGdi's emulation of GDI+ is.

The SvgNet Project

SvgNet is an Open Source project under a BSD-like license (license terms are reproduced in every SvgNet source file). SvgNet is copyright 2003 RiskCare Ltd.

The SvgNet project home page is here.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


Written By
Web Developer
United Kingdom United Kingdom
My interests are software engineering, Japanese, and talking about how good things used to be back in the good old days.

URL: http://www.jbrowse.com
Favorite Toy: http://www.ruby-lang.org


Comments and Discussions

 
AnswerRe: Compiler Errors Pin
Ben Peterson22-Aug-06 23:27
Ben Peterson22-Aug-06 23:27 
Questionplease help me! Pin
tzgpxl23-Jul-06 22:55
tzgpxl23-Jul-06 22:55 
AnswerRe: please help me! Pin
mengxh200016-Aug-06 21:40
mengxh200016-Aug-06 21:40 
GeneralSvg in SVG Pin
Anonymous12-Aug-04 0:27
Anonymous12-Aug-04 0:27 
GeneralRe: Svg in SVG Pin
16-Aug-04 18:11
suss16-Aug-04 18:11 
GeneralRe: Svg in SVG Pin
Ben Peterson16-Aug-04 22:53
Ben Peterson16-Aug-04 22:53 
GeneralRe: Svg in SVG Pin
Member 109832216-Aug-04 23:48
Member 109832216-Aug-04 23:48 
GeneralRe: Svg in SVG Pin
Member 109832216-Aug-04 23:52
Member 109832216-Aug-04 23:52 
Hi!Ben
Thanks for help.

plz help me more.I got confused.
I try to make a SVG File that has two <svg> using svgnet.
like this↓
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"[
<!ENTITY E2 'fill:rgb(0,0,255);stroke:none;opacity:1;'>
<!ENTITY E1 'fill:rgb(255,0,0);stroke:none;opacity:1;'>
]>
<svg id="SvgGdi_output"> <!-- first svgtag--!>
<rect id="background" style="fill:rgb(236,233,216);" width="100%" height="100%" x="0" y="0" />
<g id="root_group" style="shape-rendering:crispEdges;">
<rect id="4" style="&E1;" width="100" height="200" x="8" y="8" />
</g>
<defs id="clips_hatches_and_gradients" />

<svg id ="hoge"> <!-- second svgtag--!>
<g id="root_group2" style="shape-rendering:crispEdges;">
<rect id="5" style="&E2;" width="50" height="100" x="8" y="8" />
</g>
<defs id="clips_hatches_and_gradients" />
</svg>
</svg>
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

how should I write the code?
-------------------------------------------
SvgGraphics ig;
ig = new SvgGraphics();
ig.FillRectangle(new SolidBrush(Color.Red),8,8,100,200);
//---how should i write a code? i wanna insert svgtag more in SVGFile--
xxx.FillRectangle(new SolidBrush(Color.Blue),8,8,50,100);
//----
string s = ig.WriteSVGString();
StreamWriter tw = new StreamWriter("c:\\temp\\foo.svg", false);
tw.Write(s);
tw.Close();
svgCtl.SRC = "c:\\temp\\foo.svg";
-------------------------------------------

plz help me again.
thank u for reading my english. u know my English is too poor.
GeneralRe: Svg in SVG Pin
Ben Peterson18-Aug-04 7:05
Ben Peterson18-Aug-04 7:05 
GeneralRe: Svg in SVG Pin
Member 109832218-Aug-04 15:06
Member 109832218-Aug-04 15:06 
GeneralRe: Svg in SVG Pin
Frank Hileman27-Sep-04 14:53
Frank Hileman27-Sep-04 14:53 
GeneralRe: Svg in SVG Pin
Member 109832227-Sep-04 16:57
Member 109832227-Sep-04 16:57 
GeneralAdvice on WriteSVGString() Pin
hoffmanjp8-Jul-04 16:08
hoffmanjp8-Jul-04 16:08 
GeneralSaving editable vectors from c# .NET applications Pin
Nick Lim12-Aug-03 0:41
Nick Lim12-Aug-03 0:41 
GeneralRe: Saving editable vectors from c# .NET applications Pin
Ben Peterson3-Sep-03 5:57
Ben Peterson3-Sep-03 5:57 
GeneralRe: Saving editable vectors from c# .NET applications Pin
Nick Lim8-Sep-03 0:34
Nick Lim8-Sep-03 0:34 
GeneralRe: Saving editable vectors from c# .NET applications Pin
SimonS4-Oct-03 10:52
SimonS4-Oct-03 10:52 
GeneralRe: Saving editable vectors from c# .NET applications Pin
abc87612-Mar-04 4:20
abc87612-Mar-04 4:20 
AnswerRe: Saving editable vectors from c# .NET applications Pin
glusk3-Dec-06 20:35
glusk3-Dec-06 20:35 
Generalcompiler error Pin
Paresh Gheewala23-Jul-03 21:41
Paresh Gheewala23-Jul-03 21:41 
GeneralRe: compiler error Pin
Ben Peterson3-Sep-03 5:58
Ben Peterson3-Sep-03 5:58 
GeneralAnother effort... Pin
Paul Selormey9-Mar-03 1:09
Paul Selormey9-Mar-03 1:09 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.