update line chart data every 2 seconds

Recommended Posts

I like to get recommendations on how to automatically update the line chart with new data every couple of seconds (e.g. for every 3 seconds).

Since I have 3 Y axes, the real-time line chart doesn't support 3 Y axes. Then I use the Line Chart, and use setInterval(..) to update the chart at a time interval.

I am using the asp.net Core MVC project, and put the Fusionchart in a View (cshtml file). I have 7000 point data for each line, and have a total of 5 lines. The data is stored in SQL database. Reading all the data and display them take 40 seconds, the time is too long.

Instead of reading 7000 points in one shot, I want to read 200 points from SQL database each time, and then display. Then read SQL for the next 200 points and display, and keep repeating. Each time, I want to append the new data points to the prior data.

My problem is the controller gets the data, then give to View via ViewBag, it refreshes the View whole page, not very nice.

How to just refresh the chart with new data when each time getting data from SQL? Since the setInterval is in View, how to request SQL data from View?


Share this post

Link to post
Share on other sites

Hi Harry,

According to your scenario, you want to fetch data from the database periodically and want to append within the chart data source.
Hence we would like to suggest you please create a controller Action method for fetching records from the database and via AJAX you can have the result from view.
Please check the following regarding how to perform AJAX call over a time interval https://forums.asp.net/t/2090502.aspx?Calling+MVC+Action+from+JavaCripts+using+setInterval
Regarding partial vie update we would like to request you please implement Partial view rendering in ASP.NET MVC for reference please check https://www.red-gate.com/simple-talk/dotnet/asp-net/revisiting-partial-view-rendering-in-asp-net-mvc/
Moreover, we went through the attached code snippet of the Razor view and observed the ASP.NET wrapper is not implemented.
Please note FusionCharts support ASP.NET wrapper for rendering supported charts in ASP.NET environment for reference you could check the following tutorial link https://www.fusioncharts.com/blog/rendering-fusioncharts-in-asp-net-mvc-framework-using-razor-view/
Also, like to let you know you could call API methods using the FusionCharts wrapper for reference please check https://www.fusioncharts.com/dev/getting-started/aspnet/slice-data-plot-using-custom-api-in-aspnet
Please check the above mentioned suggestions and implement accordingly.

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now