Begin and End Render events for Chart

[Chris]

Hi,

I am using version 2013.2.716 of kendo dataviz and I have a chart with several series in it that is based on quite a large volume of data (approximately 1000 points in total). It takes anything up to 5 seconds to render and the UI is unresponsive while this is taking place.

Are there any events for the chart to signify pre and post render? Something along the lines of requestStart/requestEnd that you have for a data source?

Also, Is there anything that can be done in terms of the UI becoming unresponsive while the chart is being rendered? I have seen that in your roadmap that you are looking at performance improvements which would be great.

Thanks

Chris

[Hristo Germanov]

Hello Chris,

Performance tips:
1) Examine Performance tips and Rendering online help topics for the chart.
2) Consider to use canvas rendering if it fits in your case(renderAs: "canvas").

In order to decrease your points that you will passed to the chart you can wire up to read, fetch or query of the DataSource.

Could you give me more information about your scenario because I am not sure what you need to do? What browser are you using? Also if can you give me some piece of code or simple test page (in jsbin/jsfiddne) that I can examine.

Regards,
Hristo Germanov
Telerik

[Chris]

Hi Hristo,

Thanks for the reply - I have already tried the changes  you suggested in points 1 and 2 and they haven't had any noticeable improvement on performance.
-------1) Examine Performance tips and Rendering online help topics for the chart.
-------2) Consider to use canvas rendering if it fits in your case(renderAs: "canvas").

Also, the browser I am using is IE10 

You mention
----------In order to decrease your points that you will passed to the chart you can wire up to read, fetch or query of the DataSource.
Please can you expand on what you mean? The number of data points sent to the graph has already been made as efficient as possible and I am interpolating the various series in my graph.

For context, the graph is used for accident investigation (accelerometer events), so has 4 series, speed, x,y and z g-forces and there are possibly 10,000 points on the category axis.

What I am trying to do is let the user know that something is happening while the chart is being rendered - if it is going to take a while for the chart to render this is fine, I just want to display some form of progress indicator at the start/end of the rendering process. For example, when reading a data source from a remote service I can do the following to show a progress indicator

           requestStart: function (e) {
                $('#progressIndicator').show();
                $('#progressIndicator').sprite({ fps: 19, no_of_frames: 19 }).active();
            },
            requestEnd: function (e) {
                $('#progressIndicator').destroy();
                $('#progressIndicator').hide();
            }

Which works well when used with kendo data grids. Using the same approach with a kendo chart doesn't as the requestEnd is fired before the chart has started to render.

Is there a completed event that can be listened to for dataviz charts? That is really all I want.

Cheers

Chris

[Hristo Germanov]

Hi Chris,

I understand what you need to do but we haven't such events and I can't offer you a workaround for the problem. Please accept our apologies for the inconvenience this may cause.

Regards,
Hristo Germanov
Telerik

[John]

I second the request for a rendering event

[Hristo Germanov]

Hi John,

We will implement this event for our future releases but I can't give you a exact date. We are working on it so stay tuned.

Regards,
Hristo Germanov
Telerik

 

 

[Walid]

Sorry to revamp this old thread, but just to check if there is any news about Chart's renderEnd events or something similar. We would need to know when the chart is completely rendered in order to chain that with other actions.

Thanks,

Walid

[Iliana Dyankova]

Hi Walid,

Have you checked the render event - it fires after the data is bound? Does this event fit your current scenario?

Regards,
Iliana Nikolova
Telerik by Progress

 

 

[Walid]

Hello Iliana,

 

Yes, checked that event but it doesn't suit for my requirement.

I need to generate a chart on the fly with some customizations and once it's ready, save to PNG. 

The problem is that depending on the amount of data and chart settings, the animation might be still occuring when saving to PNG. Using a setTimeout() approach does not fit for all possible cases.

 

Thanks,

Walid

[Iliana Dyankova]

Hi Walid,

I am afraid there is no an event which fires after the render one. Have you tried to stop the chart animations?

Regards,
Iliana Nikolova
Telerik by Progress

 

 

[Tom]

I have about 9 kendo charts on one page and I needed a loading gif until data is bound on each chart.

In MVC Kendo use the Data method in the DataSource as the starting point of the loader and then add an events action in the chart with the Databound method and inside here you can hide the loader.

This can be done in javascript Kendo also.

It works absolute wonders.