3D chart is not working in ASP .NET Core 3.1 Example

[bairog]

Hello.
I'm trying to convert my WinForms (.NEt Framework 4. application with some 3D charts to ASP Core 3.1 Web Application.
So I performed the following:

1. Downloaded your .NET Web Examples repo - TeeChart-for-.NET-CSharp-Web-samples
2. Opened TeeChartMVCCore project
3. Retargeted it to .NET Core 3.1 (because .NET Core 3.0 is outdated and reached EOL)
4. Updated all nuget packages to latest versions (including Steema.TeeChart.NetCore to latest 4.2020.9.16)
5. Replaced

   Code: Select all

   var wChart3 = new Steema.TeeChart.Chart();

   with

   Code: Select all

   var wChart3 = new Steema.TeeChart.Chart();
   wChart3.Aspect.View3D = true;

   inside public void GetHTML5Chart(int? type)

But chart is still 2D.
Is that by design or a bug? Does your web component have functional parity with WinForms or where can I read abiut all it's limitations?

[Christopher]

But chart is still 2D.
Is that by design or a bug? Does your web component have functional parity with WinForms or where can I read abiut all it's limitations?

It's by design. In that example you will see that the Chart is being exported as a JavaScript Chart which renders to HTML5. The JS/HTML5 Chart works slightly differently, as you can see in this demo here - if you move down the left menu to the 3D section you can see that it works quite differently. On the other hand, if you were to set Aspect.View3D to true and then export to image (PNG, JPEG etc.), you would see a Chart in 3D - this is because image export (as opposed to JS/HTML5 export) uses the same GDI+ graphics as the Windows Forms version.

[bairog]

On the other hand, if you were to set Aspect.View3D to true and then export to image (PNG, JPEG etc.), you would see a Chart in 3D - this is because image export (as opposed to JS/HTML5 export) uses the same GDI+ graphics as the Windows Forms version.

Where I can find an example of exporting to image?
What is difference in functionality (legend, mouse interaction, etc.) or performance between JS/HTML5 export and image export?
Thank you in advance.

[Christopher]

Hello,

Where I can find an example of exporting to image?

Although it uses a different version of TeeChart, the TeeChart syntax is the same as that shown here.

What is difference in functionality (legend, mouse interaction, etc.) or performance between JS/HTML5 export and image export?
Thank you in advance.

Exporting as an image produces a static image with no mouse (click, zoom, scroll) functionality - if you want such functionality then using the HTML/JS Chart is your best option.

[bairog]

Although it uses a different version of TeeChart, the TeeChart syntax is the same as that shown here.

What do you mean by "different version"?
From my point of view TeeChartMVCCore project uses Steema.TeeChart.NETCore 4.2020.9.16 nuget package, TeeChartWithBlazor project also uses Steema.TeeChart.NETCore 4.2020.9.16 nuget package.

Exporting as an image produces a static image with no mouse (click, zoom, scroll) functionality - if you want such functionality then using the HTML/JS Chart is your best option.

So if I need an ASP .NET Core 3.1 web application with 3D pie chart and mouse functionality (tooltip, click, zoom, scroll, etc.) - what is the option for me? No options with your library?

[Christopher]

Hello,

What do you mean by "different version"?

You're right, my mistake, they are the same version.

So if I need an ASP .NET Core 3.1 web application with 3D pie chart and mouse functionality (tooltip, click, zoom, scroll, etc.) - what is the option for me? No options with your library?

I'm not sure - I'll check with the team and get back to you.

[Marc]

Hello,

If you require a 3D Pie then the current version of TeeChart will need to render the Pie as an image. Here's some example code, in this case an Equalizer series, simply replace it for Pie where required:

Taken from: https://github.com/Steema/TeeChart-for- ... troller.cs

Code: Select all

public ActionResult GetEqualizerChart(int? w, int? h)
{
	lock (s_renderLock)
	{
		var width = (w > 0) ? (int)w : 400;
		var height = (h > 0) ? (int)h : 300;

		var wChart2 = new Steema.TeeChart.Chart();

		Steema.TeeChart.Utils.UseCaches = false;
		wChart2.Header.Text = "Equalizer Gauge";

		var rpTheme = new Steema.TeeChart.Themes.BlackIsBackTheme(wChart2);
		rpTheme.Apply();

		wChart2.Aspect.View3D = false;
		wChart2.Series.Add(new Steema.TeeChart.Styles.Equalizer());
		wChart2.Series[0].FillSampleValues(40);

		wChart2.Panel.Bevel.Inner = Steema.TeeChart.Drawing.BevelStyles.None;
		wChart2.Panel.Bevel.Outer = Steema.TeeChart.Drawing.BevelStyles.None;

		_tempStream2 = new System.IO.MemoryStream();
		wChart2.Export.Image.PNG.Width = width;
		wChart2.Export.Image.PNG.Height = height;

		wChart2.Export.Image.PNG.Save(_tempStream2);

		_tempStream2.Position = 0;

		return base.File(_tempStream2, "image/png");
	}
}

If you require mouse interactivity for that, you could use an ASP.NET webform. Example (this is a 2D chart but could be rendered 3D with Aspect.View3D = true)
https://github.com/Steema/TeeChart-for- ... troller.cs

This chart supports interactivity via ASP.NET code-behind and Ajax front-end enablement. Examples:
http://www.steema.net/TeeChartForNET/In ... Chart.aspx
http://www.steema.net/TeeChartForNET/In ... Chart.aspx
http://www.steema.net/TeeChartForNET/In ... Chart.aspx

There are coded examples for all of these in the project residing here:
https://github.com/Steema/TeeChart-for- ... %20WebDemo

Regards,
Marc Meumann

[bairog]

Thank you, I will test that approach.

If you require mouse interactivity for that, you could use an ASP.NET webform. Example (this is a 2D chart but could be rendered 3D with Aspect.View3D = true)
https://github.com/Steema/TeeChart-for- ... troller.cs

As far as i know ASP .NET Core 3.x (and upcoming ASP .NET Core 5) doesn't support ASP.NET WebForms..

[Marc]

Re.

As far as i know ASP .NET Core 3.x (and upcoming ASP .NET Core 5) doesn't support ASP.NET WebForm

Yes, you're right, sorry for the misdirection; I should have cross-checked Framework features before the last answer.

One option would be to stay with Framework 4; it will continue to be supported.

What level of interactivity is required and to what extent is 3D a necessary requirement for your project?

With thanks.
Regards,
Marc

[bairog]

What level of interactivity is required and to what extent is 3D a necessary requirement for your project?

For now I use showing tooltips when cursor is above pie segment/line point (tChart_MouseMove event). Customer would also like to use Scroll and Zoom features.
3D for now is mostly needed as a chart display enhancement - I understand that it's a matter of taste, looks like we will need to sacrifice 3D for interactivity..

One option would be to stay with Framework 4; it will continue to be supported.

Correct, but it will obtain only security fixes and still be outdated (it's stuck on .NET Standard 2.0) - so no new APIs, no latest C# version, no modern CLR features, etc.. Looks like poor choice.

[Marc]

Hi,

Yes, I think the route using TeeChart's javascript render would be the surer option going forward and it is fully interactive. New features will be added to strengthen the JS render support as standalone and for NET as time moves forward. I don't think 3D will be added in the near term though; TeeChart JS does include a WebGL 3D option (https://www.steema.com/files/public/tee ... sic_3d.htm) but it's quite complex to use in a business application and we would recommend to stay with 2D.

Regards,
Marc