echarts中setOption没有重新渲染表格，导致图表显示有问题？

2017-09-11 10:33:27 9065 收藏 2
分类专栏： 后端 前端 文章标签： echarts
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Time888/article/details/77930526
版权
后端 同时被 2 个专栏收录
128 篇文章 0 订阅
订阅专栏
前端
5 篇文章 0 订阅
订阅专栏

问题：echarts中setOption没有重新渲染表格，导致图表显示有问题

说明：
使用的是折线图
第一次渲染的是三组数据，显示三根线。
切换后数据调整为两组，但是图表仍然显示三根线。
排查后数据源没有问题，但是显示有问题，猜测是echarts问题，查找资料发现没有重新渲染。

解决方法：
myChart.setOption(chartOption,true); 第二个参数设置为true

参考链接：https://github.com/ecomfe/echarts/issues/3976

han8gui
关注
  • 5
    点赞
  • 5
    评论
  • 2
    收藏
  • 一键三连
    一键三连

  • 扫一扫，分享海报

专栏目录
Echarts通过json从数据库获取实时数据实现动态仪表盘
05-19
发现Echarts 的仪表盘做的比hightcharts更漂亮，而且加载异步数据的方法更简单方便，所以用Echart做了仪表盘，并且采用jQuery的方法，可以大大精简代码语句，与大家分享，继续学习中。
linux下利用/proc进行进程树的打印
02-02
在linux下利用c语言实现的进程树的打印，主要通过/proc下的目录中的进程文件，获取status中的进程信息内容，然后利用递归实现进程树的打印
表情包
插入表情
还能输入1000个字符
相关推荐
echarts多次进行SetOption的时候数据遗留问题
周金鱼啊
12-20 1万+
最近在使用  "echarts"的时候遇到了一个很是严重的问题，哈哈哈哈 就是通过点击的标题不同后台返回不同的数据，返回的echarts数据中有的为一条折线数据，有的就是三条折线数据，如图  然后在点击标题来回切换的时候就出现了数据残留的问题，本来数据返回的只有一条数据，但是却显示了三条！！！ 根据度娘提示，试用了 " myChart.setOption(option，true); ...
Echarts 图表不能渲染问题整理
又是再见?
03-21 1万+
在开发中遇到Echarts重新setOption之后图表没有渲染出来, 背景是条件切换后没有数据时将Echarts容器内清空了，更换正确条件后数据也有了，Echarts实例打印出来也正常， 但是由于容器上已经有  _echarts_instance_ ，还是上次的，所以Echarts是不会重新初始化的，需要手动将DOM上的 _echarts_instance_  属性移除， 再次进行初始化， 然后...
echarts的setOption第二个参数的坑
後来的博客
11-27 1079
遇到的问题：在开发的时候的发现数据更新后，echarts图重绘后还会保留之前的数据 myChart.setOption({...},true) 第二参数为true时，表示不合并。为false时，表示合并，（合并就是会保留之前的数据） ...
解决Echarts图表在div动态切换时不显示的问题
kirinlau的专栏
09-08 2万+
简单粗暴，先上图，大概长这样：在使用vue时有遇到像上图下拉框change事件切换div，change切完后大概会变成这个样子：上代码：<div class="test"> <p class="title"> <select v-model="selected" v-on:change="change"> <option v-for="option in
Echarts图设置好了但是在页面无法显示问题
weixin_49160916的博客
04-23 252
Echarts图设置好了但是在页面无法显示问题 明明已经按照echarts官网的方式设置好了echarts图，甚至的按照示例一模一样的数据也无法在页面中显图形， 但是用于装echarts图的容器却可以很正常的显示出来。 在控制台中也能够正确打印出完成初始化的echarts图数据，那么原因可能是因为echarts图在初始化渲染的时候浏览器还没有加载好，所以无法显示。 使用vue和jQuery都有的框架页面，浏览器和echarts加载都很快，但vue的组件创建和挂载速度相比浏览器和echarts的速度慢，以此导
解决双重请求数据时，获取到数据，但页面不显示的问题
ygkyufcl的博客
10-29 166
data(){ return {data:[],FinalData:[]} }, async created(){ await getOneData().then(res=>{ this.data=res.data.data; this.getData(); }) }, methods:{ async getData(){ var data=[]; for(let i=0;i<this.data.length;i++){ await getTwoData().the
echarts重新加载数据后数据条数不对？没有重新渲染
行百里者半九十
04-12 1244
前言：之前使用echarts折线图时，先是加载十条数据，后面再次加载一条数据发现页面上还是十条数据，只有第一条变成第二次加载后的数据。 提问：为何折线图没有全部更新数据，删除多余的数据？ 直接查看官方文档: 可以看到：setOption有三个属性，其中notMerge是设置是否合并的，默认是false. 结果：设置notMerge为true就可以去全量更新option,即setOption(o...
echarts数据变了不重新渲染，以及重新渲染了前后数据会重叠渲染的问题
weixin_30652897的博客
04-18 2416
1.echarts数据变了但是视图不重新渲染 新建Chart.vue文件 <template> <p :id="id" :style="style"></p> </template> <script> export default { name: "Chart", data() { return { /...
关于Echart二次渲染option不成功，第一次与第二次数据混乱问题
qq_41348029的博客
12-04 3990
最近在使用echarts做图表，二次生成图表时数据合并,无法正确显示。 第一次渲染： 第二次渲染： 可以看到这里的echarts项的series变为2个(如上图)，但是渲染后的效果series项还是和第一次相同。 解决办法：应该设置mychart.setoption({},true); 原因：chart.setOption(option,notMerge,lazyUpdate);...
echarts 数据重新加载,原数据依然存在图表上的问题
cbat的博客
10-29 2311
echarts 数据重新加载,原数据依然存在图表上 这是因为多次调用时option选项默认是合并（merge）的，加上true表示不合并配置 myChart.setOption(option,true); // 加上true表示不合并配置 ...
echarts 重新渲染时图表重叠现象的问题解决方法
weixin_33937913的博客
05-02 689
问题描述： 1、选择系列--生成图表--不选系列--生成图表--正常（图表不会重叠）； 2、选择系列--生成图表--全屏--还原--不选系列并改变图表类型--生成图表--异常（图表重叠）。 问题原因： myChart.setOption(option); 修改为： myChart.setOption(option,true);解决问题。 归根结底是：echarts重新渲染的问题！ ...
echarts setoption组件作用
gufengblog的博客
05-12 1952
官网： https://echarts.apache.org/zh/option.html#useUTC 结构图: 续： title:标题设置 legend：图例控制 grid：图例内网格控制 xAxis：X轴 yAxis：Y轴 polar：极坐标 radiusAxis：极坐标系径向轴 angleAxis：极坐标系的角度轴。 radar：雷达图坐标系组件 dataZoom：图表缩放控件 visualMap： 视觉映射组件 tooltip：提示框控件 axisPointer：坐标轴指示器（axisPoi
echarts图表不显示
zhaoq6的博客
02-07 780
项目场景： vue中使用echarts折线图，需要点击获取数据然后显示对应的折线图 问题描述： 显示折线图时发现太小，只能显示一部分，图表大小并没有自适应，初始化时已经给了resize this.linechart = echarts.init(this.$refs.linechart); this.linechart.setOption(this.lineOption); window.addEventListener("resize", () => { this.linechart.resi
©️2020 CSDN 皮肤主题: 撸撸猫 设计师:马嘣嘣 返回首页
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、C币套餐、付费专栏及课程。

余额充值