[echarts]使用ajax获取数据作图showLoading()失效问题解决

最新推荐文章于 2024-04-07 10:59:37 发布

ZhiMaHuyizhi

最新推荐文章于 2024-04-07 10:59:37 发布

阅读量662

点赞数 1

文章标签： echarts ajax javascript

本文链接：https://blog.csdn.net/ZhiMaHuyizhi/article/details/122946093

版权

在使用Echarts与Ajax获取数据进行图表绘制时，遇到showLoading加载动画不显示的问题。问题出在hideLoading方法的调用位置错误，原本放在错误的位置导致加载过程中未显示动画。正确做法是将hideLoading方法放入Ajax数据获取成功后的回调中，这样在数据加载期间就能正常展示动画效果。

摘要由CSDN通过智能技术生成

原代码：

    //散点图
    function displacementAnalysisChart() {
        displacementAnalysis.clear();
        displacementAnalysis.showLoading({text: '正在努力的读取数据中...'});

        $.ajax({
            async: true,
            dataType: 'json',
            data: {analysisParameter:$("#analysisParameter").val()},
            type: 'post',
            url: '${ctx}/completeMachine/displacementAnalysisChart',
            success: function (data) {
                if (data.code == 200) {
                    displacementAnalysis.setOption(data.data);

                } else {
                    parent.$.jBox.tip(data.message);

                }
            }
        });
         displacementAnalysis.hideLoading();
    }

此时showLoading()方法失效，不管获取数据耗费多久都没有等待动画。

原因：hideLoading()方法放错地方，应该写在ajax中

修改后：