[CLOSED] Using SVG library for saving chart images

[cwolcott]

Glad that the thread below was posted and that you gave an example.

Thread #1 - Exporting 2 Charts into Single png

It provided a work around to an issue that I have had for several months.

Thread #2 - Using SVG [Post #7 an beyond]

The issue is the background image of the Ext.NET chart is not being captured and thus when using the SVG library the background is grey. If you add the following button and method to the thread #1 example you will see what I mean.

...
[DirectMethod]
public void SaveSvgChart1Only(string svg1)     {
   XmlDocument xd = new XmlDocument();
   xd.XmlResolver = null;
   xd.LoadXml(Server.HtmlDecode(svg1));
   var svgGraph = Svg.SvgDocument.Open(xd);
   svgGraph.Draw().Save(@"c:\\testChar1Only.png", System.Drawing.Imaging.ImageFormat.Png);
} 
...
<ext:Button
     runat="server" 
     Text="Save SVG Chart #1"
     Handler="var svg1 = Ext.htmlEncode(Ext.draw.engine.SvgExporter.generate(#{Chart1}.surface)); #{DirectMethods}.SaveSvgChart1Only(svg1);" />

So for a work around I perform the same steps you did in the example for saving just one chart and clear the canvas to white.

If in your example Chart #1 had

StyleSpec="background: yellow;"

how would you save the chart via SVG so that it looked the same as what is on the screen?

[Baidaly]

Hello!

You should use Background property because when you use StyleSpec it doesn't go to SVG, it stays only in browser:

<ext:Chart
	ID="Chart1"
	runat="server"
	Width="400"
	Height="400">
	<Background Fill="#FFFF00" />

[cwolcott]

Very cool. To many attributes everywhere. I think I have graduated to 8th grade in understanding things, and you throw me back to 3rd grade.

Please close the thread.

[Baidaly]

I have the same feelings sometimes when I'm talking with Daniil :)

[Daniil]

I always have the same feelings talking to Vladimir:)))

[cwolcott]

Based on the comment above about StyleSpec attribute vs the Background property would you want to change several of the chart examples from using StyleSpec to Background?

You do have the 'Save Image' button that produces a PNG for the chart and the background is not white because of using the SytleSpec.

Chart -> Area -> Basic
Chart -> Area -> Browser_Stats
Chart -> Bar -> Grouped
Chart -> Bar -> Mixed
Chart -> Bar -> Renderer

Plus many others ...

[Daniil]

Thank you for that catch. But... let's imagine it was done intentionally, i.e. a user doesn't need that background to go with a chart on saving;)

[cwolcott]

That is fine. The reason I had an issue was as a newbie to Ext.NET I looked at the examples and used StyleSpec to color my chart backgrounds (Like the example) and didn't look further for an additional property in Chart. Thus when I went to use SVG I didn't understand why the background was not being picked up by SVG.

Obviously the error was mine for not using <Background Fill="white">, but in your examples you were using StyleSpec and had a button to "Save Image" so I thought I was good.

Not a problem. It is just what I experienced 6 months ago when I was integrating SVG into my charts.

[Daniil]

Fair enough. Sorry that our examples misled you in that case.

[Baidaly]

I'm agree with @Daniil, but we will add new samples with SVG where we will take into account your note about background.