In This Topic
When you export SVG content you can modify various aspects of the generated SVG by using the properties exposed by the NSvgImageFormat object. This object is passed to the control when exporting SVG both in Windows Forms and Web Forms applications. The following code snippets refer to Web Forms, because it's the most likely platform where you'll need SVG export, but the settings work in exactly the same manner in Windows Forms as well.
Generating compressed SVG (SVGZ)
The component can generate GZIP compressed SVG content, which may be very useful when you want to optimize the traffic generated by your web site. Compressed SVG files have an extension of .svgz. To enable compressing you need to set the Compress property to true:
| C# |
Copy Code
|
NSvgImageFormat svgImageFormat = new NSvgImageFormat();
svgImageFormat.Compress = true;
|
| Visual Basic |
Copy Code
|
Dim svgImageFormat As New NSvgImageFormat
svgImageFormat.Compress = True
|
Embedding images
SVG can contain vector and raster data. Raster data can also be embedded in the SVG content by using base64 encoding. This can be very handy if you do not want to distribute additional images along with generated SVG or SVGZ file. This feature is controlled by modifying the EmbedImagesInSvg and EmbeddedImageFormat properties of the NSvgImageFormat object:
| C# |
Copy Code
|
NSvgImageFormat svgImageFormat = new NSvgImageFormat();
svgImageFormat.EmbedImagesInSvg = true;
svgImageFormat.EmbeddedImageFormat = new NJpegImageFormat();
|
| Visual Basic |
Copy Code
|
Dim svgImageFormat As New NSvgImageFormat
svgImageFormat.EmbedImagesInSvg = True
svgImageFormat.EmbeddedImageFormat = New NJpegImageFormat
|
When you set the EmbedImagesInSvg property to true the component will automatically embed all images contained in NImageFillStyle objects in the SVG content. The EmbeddedImageFormat defines how to encode the images. For small size it is recommended to use JPEG otherwise PNG is the preferred image format because it uses looseless compression.
SVG and Browser Redirection
The generated SVG content can redirect the client browser to a specified URL when the user clicks on a particular element. This is achieved by using the SVG anchor element allowing you to have SVG content linking to other HTML pages. This works in much the same way as HTML image maps. In order to generate interactive content you must turn on the EnableInteractivity property of the NSvgImageFormat object attached to the NImageResponse object:
| C# |
Copy Code
|
NSvgImageFormat svgImageFormat = new NSvgImageFormat();
svgImageFormat.EnableInteractivity = true;
|
| Visual Basic |
Copy Code
|
Dim svgImageFormat As New NSvgImageFormat
svgImageFormat.EnableInteractivity = True
|
SVG and Client Side Scripting
SVG can contain ECMAScript which is very similar to the JScript language. To embed script with the SVG content generated by the component you need to modify the CustomScript property of the NSvgImageFormat. For example:
| C# |
Copy Code
|
NSvgImageFormat svgImageFormat = new NSvgImageFormat();
svgImageFormat.EnableInteractivity = true;
svgImageFormat.CustomScript = "script goes here";
|
| Visual Basic |
Copy Code
|
Dim svgImageFormat As New NSvgImageFormat
svgImageFormat.EnableInteractivity = True
svgImageFormat.CustomScript = "script goes here"
|
Linking this script with the SVG content generated by the component is achieved by using the CustomMapAreaAttribute property of the NInteractivityStyle object attached to every visual object in the control. The script can reference each chart element by its Id property.
