SVG Graphics

Netica can generate very high quality graphics for print publishing or website construction. These graphics are in a format known as SVG, which stands for "scalable vector graphic". It is the main XML based format for graphics, and since it is a vector graphic, the images look very good at all resolutions, and the file sizes are very small. (Netica can also make other vector graphics).

SVG was jointly developed by W3C, Adobe, Sun, Apple, IBM, etc. Microsoft has stated that all their relevant products will support it (the latest version of MS Visio now does). SVG graphics can be imported into most modern Adobe products, for editing or converting to other graphics formats. The Firefox (Mozilla) and Opera browsers natively support SVG graphics, and various plug-ins are available for the Microsoft browser.

How To: Have Netica display your Bayes net in the desired style, make sure it is the active window, and choose File → Export Graphics, or press ctrl+g. If you want the graphic to be of a subset of the net, select the desired nodes first. The default format that Netica will generate is SVGZ, which is a compressed SVG. SVGZ is generally a better choice because it has a significantly smaller file size, produces exactly the same image, and most programs can work with it. If you need a regular SVG, either because it is for some program that can't work with SVGZ, or because you want to examine or edit it with a text editor (or XML editor), then choose "Graphics File - XML (.svg)" from the drop-down menu at the bottom of the Save As dialog box that appears during generation.

Image Editing: Once an SVG has been made, you can open it with Microsoft Visio and edit the image. Nodes will act as whole objects, so they can be moved, resized, scaled, etc. If you want to edit some feature within a node, you must first "ungroup" the node, with Shape → Grouping → Ungroup. You can also add titles and graphics, change colors and the like to make sharp presentation pieces.

Microsoft Browser: Since MS Internet Explorer does not yet natively support SVG, it requires a plug-in. There are several available, but currently the best is the one from Adobe, since it can do zooming and panning. That plug-in usually gets quickly and painlessly installed over the internet as soon as Explorer tries to display an SVG (after putting up a dialog box asking if you want it installed). If you don't see the dialog box, then you can get the plug-in from:

http://www.adobe.com/svg/viewer/install/main.html

Examples: If you wish to see examples of SVGs generated from Bayes nets and how to build a website using them, see:

http://www.norsys.com/netlibrary/index.htm

Website Construction: To add an SVG graphic to a web page, you can put the .svg or .svgz file in the same directory as the HTML file for the web page, and in the HTML file put:

width="100%" height="100%"

pluginspage="http://www.adobe.com/svg/viewer/install/">

The width and height attributes are not strictly necessary, but are often useful.

Note that Adobe no longer recommends using the OBJECT tag (see http://www.adobe.com/svg/viewer/install/mainframed.html).

For the web server, you probably don't have to do anything, since recent versions of web servers (Apache, IIS, etc.) are already properly configured, but for older versions you need to add to their mime-type table that the official MIME-type for SVG and SVGZ documents is:

image/svg+xml

The above information was valid as of Oct 2006, but since browsers often change, it may be wise to Google for the latest recommendations from Adobe, Microsoft, Mozilla, Opera, etc. Useful sites include:

http://www.adobe.com/svg/indepth/pdfs/ReadMewin.pdf

http://www.adobe.com/svg/viewer/install/mainframed.html

http://www.mozilla.org/projects/svg/faq.html

For supporting older versions of Firefox and Opera that do not support the EMBED tag, we have found the following to work:

<head>

<body>

if (i.e.){

document.write('<embed src="myFile.svgz" width="100%" height="100%" pluginspage="http://www.adobe.com/svg/viewer/install/">');

} else {

document.write('<object data="dir/myFile.svgz" width="100%" height="100%" type="image/svg+xml"></object>');

}

</script>

</body