1.  我们在日常的开发中使用Echarts时,不像在学习的过程中是自己在option中的配置项填写图表需要的参数,而是通过ajax请求后台,获取数据后,使用javascript来动态的修改数据,但是有的时候我们在选择一定得条件时获取不到数据,当没有数据时ECharts会默认调用 noDataLoadingOption 这个配置项中的内容来显示一个冒泡的页面,中间显示暂无数据这四个字:

2.  当我们使用的这个图表没有  xAxis 这个配置项的时候就没有问题,但是我们使用柱状图和折线图的时候就会报错,这个问题我一开始就有一点点想不通,因为这个错误显示的是 option 下的data,但是大家都知道 option 下没有 data 这个配置项,于是我就在官网的实例中试着在有 data 的配置项中删除数据,然后发现是 xAxis 中的 data 为空时就会报错,有了错误之后这个 js 就不会继续执行下去,这个我们都是知道的,但是我需要的就是在没有数据时显示以上的界面啊,这个问题就把我难倒了,于是我在网上搜索这个问题的答案,发现并没有,但是这还是阻止不了我解决问题的脚步,于是我突然想到了可不可以自己在新定义一个 option 呢?想到这个后我就新定义了一个 option ,里面就是有几个什么内容都没有的配置项,代码下面会贴出,这个时候我们就可以在 js 中进行判断了,当 xAxis 中的 data 没有数据的时候我们就可以使用自己新建的 option ,反则使用之前的 option:这个时候新建的 option 因为里面什么都没有,就会显示上面的界面。

if(insOption.xAxis[0].data.length == 0){
pieChart.clear();
var option1 = {
title :{
text:""
},
series:[
{ }
]
};
pieChart.setOption(option1);
}else{
pieChart.clear();
pieChart.setOption(insOption);
}

ECharts问题--柱状图和折线图中xAxis.data为空时报错问题解决的更多相关文章

  1. 解决echarts的叠堆折线图数据出现坐标和值对不上的问题

    原文:https://blog.csdn.net/qq_36538012/article/details/88889545 ------------------------------- 说一个小bu ...

  2. Python 中 plt 画柱状图和折线图

    1. 背景 Python在一些数据可视化的过程中需要使用 plt 函数画柱状图和折线图. 2. 导入 import matplotlib.pyplot as plt 3. 柱状图 array= np. ...

  3. 数据可视化(Echart) :柱状图、折线图、饼图等六种基本图表的特点及适用场合

    数据可视化(Echart) 柱状图.折线图.饼图等六种基本图表的特点及适用场合 参考网址 效果图 源码 <!DOCTYPE html> <html> <head> ...

  4. echar图柱状图和折线图混合加双侧y轴坐

    代码如下: floorSalesBar(){//方法名====这个方法应该放在methods中并在mounted中调用哦 methods let _this = this; let myChart = ...

  5. FusionCharts数据展示成饼状图、柱状图和折线图

    FusionCharts数据展示成饼状图.柱状图和折线图 本文以展示柱状图为例进行介绍,当然这仅仅是一种方法而已:还有很多方法可以用于展示图表,例如echarts,自定义图表标签.使用jfreecha ...

  6. JFreeChart 图表生成实例(饼图、柱状图、折线图、时序图)

    import java.awt.BasicStroke; import java.awt.Color; import java.io.FileOutputStream; import java.io. ...

  7. 【转】使用DevExpress的WebChartControl控件绘制图表(柱状图、折线图、饼图)

    第一次写博,没什么经验,主要是把最近自己对Dev的一些研究贴出来大家共同探讨,有不足之处望大家帮忙斧正. WebChartControl是DevExpress控件群下的一个Web图表控件,它使用非常的 ...

  8. HighCharts之2D柱状图、折线图的组合多轴图

    HighCharts之2D柱状图.折线图的组合多轴图 1.实例源码 SomeAxis.html: <!DOCTYPE html> <html> <head> < ...

  9. HighCharts之2D柱状图、折线图的组合双轴图

    HighCharts之2D柱状图.折线图的组合双轴图 1.实例源码 DoubleAxis.html: <!DOCTYPE html> <html> <head> & ...

随机推荐

  1. DFS实现模板

    以如下图的无向图G4为例,进行图的深度优先搜索: 假设从顶点v1出发进行搜索,在访问了顶点v1之后,选择邻接点v2.因为v2未曾访问,则从v2出发进行搜索.依次类推,接着从v4 .v8 .v5出发进行 ...

  2. BufferedInputStream/BufferedOutputStream

    BufferedInputStream: public synchronized int read() throws IOException int res=bis.read(); System.ou ...

  3. idea 快捷键(复制)

    Ctrl+Shift + Enter,语句完成“!”,否定完成,输入表达式时按 “!”键Ctrl+E,最近的文件Ctrl+Shift+E,最近更改的文件Shift+Click,可以关闭文件Ctrl+[ ...

  4. thinkphp3.2 验证码的使用

    验证码生成: public function verify(){ ob_clean(); $verify = new \Think\Verify; $verify->codeSet = '012 ...

  5. P4016 负载平衡问题

    题目描述 G 公司有 n 个沿铁路运输线环形排列的仓库,每个仓库存储的货物数量不等.如何用最少搬运量可以使 n个仓库的库存数量相同.搬运货物时,只能在相邻的仓库之间搬运. 输入输出格式 输入格式: 文 ...

  6. 【题解】JSOI2009游戏

    真的没想到...果然反应太迟钝,看到题目毫无思路,一点联想都没有. 按照网上博客的说法:一眼棋盘染色二分->二分图->最大匹配->BINGO?果然我还是太弱了…… 我们将棋盘黑白染色 ...

  7. 【模拟赛·polyline】

    Input file: polyline.in Output file: polyline.out Time limit: 1s Memory limit: 128M 有若⼲个类似于下⾯的函数: 定义 ...

  8. Super Moban

    HAO BAN ZI 包括求解,判断无解,求自由变元个数以及标记不确定的变元.来源:http://blog.csdn.net/keshuqi/article/details/51921615 #inc ...

  9. How to turn off the binary log for mysqld_multi instances?

    Q: MySQL supports running multiple mysqld on the same server. One of the ways is to use mysqld_multi ...

  10. [bzoj 3224]手写treap

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=3224 bzoj不能用time(0),看到这个博客才知道,我也RE了好几发…… #inclu ...