我是做java开发的,最近公司让我做前端统计图表柱形图之类的,我用的就是echarts,版本是2.2.7,接下来,就说说我遇到的问题,因为我是小白,所以记录一下。
ajax请求返回数据为空时显示暂无数据
echarts默认的是显示气泡,我换了种样式,是这样的
自定义样式只需要在option中加入这样一段代码:
noDataLoadingOption: {
text: '暂无数据',//没有数据时显示的文字
effect: 'whirling',//loading效果,此为气泡,还有'spin' | 'bar' | 'ring' | 'whirling' | 'dynamicLine' | 'bubble'
effectOption: {
backgroundColor: "rgba(50,50,50,0)",//loading的背景
},
textStyle: {//没有数据时显示的文字的样式
fontSize: 32,
fontWeight: 'bold'
}
},
背景色啥的都可以自己挑,样式代码里写了可以选择。只是要注意的是这段代码智能在版本3之前用。
在我加了这一段代码以后,显示是可以正常显示了,但是,当我点击其他按钮再点击当前按钮的时候就会出现空白。我找了半天才发现是一段代码的原因,就是下面这个:
myChart.hideLoading();
因为在加载的时候需要这段代码来过渡,就是一个提示信息:
myChart.showLoading({
text: "图表数据正在努力加载...",
effect: 'whirling'
});
所以我用hideLoading来取消他,其实hideLoading代码直接写在ajax成功以后的回调函数里就可以,而我在按钮的点击事件中又写了一遍,所以造成点击其他按钮再点回来就会显示空白的问题。
是我自己的问题,记录一下,以此示警!!!