Last Updated: 21 Jan 2020 08:16 by ADMIN
IT Valk Solutions
Created on: 21 May 2019 10:17
Category: Chart
Type: Feature Request
Refresh the data in my chart automatically after a set interval

01 @(Html.Kendo().Chart<Model>() 02 .Name("Donut_" + @customId) 03 .DataSource(dataSource => dataSource 04 .Custom() 05 .Type("aspnetmvc-ajax") 06 .Transport(transport => transport 07 .Read(read => read. 08 Action("Data_Read", "Data") 09 )
10 .Refresh(refresh => refresh.
11 Interval(5000)
12 )
13 ) 14 .Events(events => events 15 .Error("onDonutError") 16 ) 17 .Schema(schema => schema 18 .Data("Data") 19 .Total("Total") 20 .Errors("Errors") 21 ) 22 ) 23 .Series(series => { series 24 .Donut( 25 model => model.Value, 26 model => model.Description, 27 model => model.Color, 28 null 29 ) 30 }) 31 .Events(events => events 32 .SeriesHover("onDonutSeriesHover") 33 .Render("onDonutRender") 34 ) 35 )

I would like to have an option to set an interval for refreshing the data in my chart (or any other control that uses a datasource). At this moment, I need to use the jQuery setInterval function to refresh the chart, but when using a dynamic range of controls, I don't want to write a refresh for every control on my page.

This can be done in two ways. First, a parameter in the wrapper that takes an int as value (for instance 5000 for 5 seconds). Second, an event that hooks into a JavaScript function, passing the id and type of the control. The first option is absolutely preferred (as shown in the code on line 10).

If you're declining this request, please advise on the best practice to handle this situation with regard to dynamic dashboards.

Alex Hajigeorgieva
Posted on: 28 May 2019 08:18

The Kendo UI suite offers a SignalR data source type that can be used for scenarios where you need to ensure the data is refreshed at each change. 

We currently have a Core demo that you can test online but the functionality exists for MVC as well:

Another option is to have a shared data source. The change event in the shared data source triggers a widget rebind, too, causing it to refresh. For example, you can have three charts all bound to the same data source. 

- Create a standalone data source and assign it to the three charts
- Set the charts as AutoBind(false) to prevent three initial requests 
- Read the data source programmatically, this will populate all three widgets
- Call the read() method of the data source at the desired interval and automatically, all widgets bound to it will be refreshed with a single request

If you can think of another reason why neither of these approaches would work, we would love to hear more about it.

Look forward to hearing your thoughts on it.

Kind Regards,
Alex Hajigeorgieva
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Posted on: 22 May 2019 07:15
Would love to see this!