Echarts通过ajax获取数据定时更新轮询的解决方案及问题分析

简介: Echarts通过ajax获取数据定时更新轮询的解决方案及问题分析

一、目前网上常用的解决方案

//将ajax封装起来启用一个定时器达到三秒抓一次数据
window.function(){
    setInterval(ajaxNew(),3000);
}

存在的问题是,首次加载缓慢,用户体验性差,数据加载不友好。

二、升级定时刷新方案

// 执行异步请求
 var salesinterval;
         getsales();
clearInterval(salesinterval);
        //自动刷新;
        salesinterval = setInterval(function () {
            getsales()
        }, 6 * 1000);

首次下载页面即加载数据,然后再定义自动刷新时间;

三、淘汰的方案

在ajax获取数据后,定时刷新页面。虽然数据可以刷新,但是是整体数据的刷新,并非单列数据的更新,会出现“闪屏”

            //定时更新数据,会出现刷屏,而不是单列数据的自动更新
            setInterval(function () {
              window.location.reload()
            }, 6 * 1000);


漏刻有时(LOCKDATA),数据可视化大屏,挖掘大数据背后的价值。

相关文章
|
8月前
|
Web App开发 数据采集 前端开发
Python + Chrome 爬虫:如何抓取 AJAX 动态加载数据?
Python + Chrome 爬虫:如何抓取 AJAX 动态加载数据?
|
XML 前端开发 JavaScript
PHP与Ajax在Web开发中的交互技术。PHP作为服务器端脚本语言,处理数据和业务逻辑
本文深入探讨了PHP与Ajax在Web开发中的交互技术。PHP作为服务器端脚本语言,处理数据和业务逻辑;Ajax则通过异步请求实现页面无刷新更新。文中详细介绍了两者的工作原理、数据传输格式选择、具体实现方法及实际应用案例,如实时数据更新、表单验证与提交、动态加载内容等。同时,针对跨域问题、数据安全与性能优化提出了建议。总结指出,PHP与Ajax的结合能显著提升Web应用的效率和用户体验。
282 3
|
JSON 前端开发 数据格式
layui 穿梭框transfer组件 数据data用ajax来获取
layui 穿梭框transfer组件 数据data用ajax来获取
543 2
|
Web App开发 前端开发 JavaScript
Python编程—Ajax数据爬取(一)
Python编程—Ajax数据爬取(一)
212 0
|
前端开发 NoSQL MongoDB
Python编程—Ajax数据爬取(二)
Python编程—Ajax数据爬取(二)
320 0
|
前端开发 JavaScript Java
Spring创建Ajax和接受Ajax数据-spring20
Spring创建Ajax和接受Ajax数据-spring20
N..
|
XML JSON 前端开发
jQuery实现Ajax
jQuery实现Ajax
N..
162 1
|
XML 前端开发 JavaScript
jQuery中ajax如何使用
jQuery中ajax如何使用
217 0
|
前端开发 JavaScript
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
165 0
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]