How to embed SVG code inside TabPane

[kdsingh]

I am making a small app for our office internal use as a means of evaluating SmartClient.

I have a drawing and the svg for it. SVG is made up of multiple images. The svg is attached.

The main structure of my application is TabSet with 3 tab panes.
I would like to render that SVG in that pane. I could not find a straight forward way to do this with SmartClient.

One way using an iFrame inside the pane and rendering SVG inside it but I would rather use this issue as a way to explore SmartClient.

[edgraaff]

You could try to define a widget that displays SVG:

isc.defineClass("SVG", "Canvas").addProperties({
	getInnerHTML: function() {
return "<svg xmlns=\"http://www.w3.org/2000/svg\" id=\"mainSvg\"></svg>";
	},

	draw: function() {
		this.Super("draw", arguments);
		// for instance: load the SVG here and put it in document.getElementById("mainSvg")
	},
	redrawOnResize: false
});

isc.TabSet.create({ width: "100%", height: "100%", tabs: [ { title: "SVG", pane: isc.SVG.create() } ] });

[GeneL]

Specific code example please..

Would you please provide a code sample how to load this svg file to the canvas?