一、问题描述

根据用户的操作,通过Ajax请求,获取某段时间内的某数据趋势折线图数据。用户切换数据项或更改时间段时,ie中渲染的折线图包含了上一次获取的数据,导致数据错乱,如下图所示:

二、代码

数据项1setOption代码:

myChart3.setOption({
tooltip: {
trigger: 'axis',
formatter: _name + ':-'
},
xAxis: [{
data: ["2016-12-15", "2016-12-31", "2017-1-1", "2017-1-15", "2017-1-31", "2017-2-1", "2017-2-15"]
}],
series: [{
name: _name ? _name : '违规总数',
data: [2, 66, 10, 248, 50, 168, 22]
}]
});

数据项2setOption代码:

myChart3.setOption({
tooltip: {
trigger: 'axis',
formatter: _name + ':-'
},
xAxis: [{
data: ["2017-1-15", "2017-1-31", "2017-2-1", "2017-2-15"]
}],
series: [{
name: _name ? _name : '违规总数',
data: [55, 11, 3, 99]
}]
});

三、解决方案

通过测试,发现ie浏览器在首次设置数据项数据时,不会发生数据错乱。数据错乱只发生在再次使用setOption设置数据,由此猜测是上次的数据遗留影响了数据的显示。在API中找到了clear方法,用于清空当前实例,官网中解释如下:

在setOption之前插入如下代码:

myChart3.clear();
initChart3Option();

再次测试ie中的数据项2:

四、结束语

使用echarts时出现数据混乱,可以先尝试使用clear看看效果啦,clear之后记得重新initOption喔,因为clear之后,之前配置的图表参数也没啦~\(≧▽≦)/~若是内容有错误或遗漏,欢迎大家批评指正~

如何解决在ie下,Echarts多次使用setOption更改数据时,数据错乱问题的更多相关文章

  1. angularJs解决模态框下echarts不显示问题

    例如:摸态框myModal.html,给它命名一个id,id='myModal'; myModal.html页面想画一个echarts图表 这里是angularJs已经封装好的echarts在html ...

  2. 完美解决,浏览器下拉显示网址问题 | 完美解决,使用原生 scroll 写下拉刷新

    在 web 开发过程中我们经常遇到,不想让用户下拉看到我的地址,也有时候在 div 中没有惯性滚动,就此也出了 iScroll 这种关于滚动条的框架,但是就为了一个体验去使用一个框架好像又不值得,今天 ...

  3. 解决redhat linux下IP地址可以ping通,域名无法ping通问题

    解决redhat linux下IP地址可以ping通,域名无法ping通 在/etc/resolv.conf中添点东西 格式如下: nameserver xxx.xxx.xxx.xxx nameser ...

  4. 解决Windows 10下Wireshark运行问题

    解决Windows 10下Wireshark运行问题在Windows 10下,安装Wireshark时候,提示WinPcap不被系统系统支持.这是由于最新版的WinPcap 4.1.3只支持到Wind ...

  5. 解决Linux/aix 下的websphere log4j不生效

    websphere 解决Linux/aix下的log4j不生效 在目录: /IBM/WebSphere/AppServer/profiles/AppSrv01/properties 增加一个文件:可以 ...

  6. MyEclipse第一个Servlet程序 --解决Win7系统下MyEclipse与Tomcat连接问题

    前言 本文旨在帮助学习java web开发的人员,熟悉环境,在Win7系统下运行自己的第一个Servlet程序,因为有时候配置不当或系统原因可能会运行不成功,这给初学者带来了一定烦恼,我也是为此烦恼过 ...

  7. 解决在Linux下安装Oracle时的中文乱码问题

    本帖最后由 TsengYia 于 2012-2-22 17:06 编辑 解决在Linux下安装Oracle时的中文乱码问题 操作系统:Red Hat Enterprise Linux 6.1数据库:O ...

  8. 解决全站ie6下PNG图片不透明问题只要几行代码

    解决全站ie6下PNG图片不透明问题只要复制下面这几行代码粘贴在你的文档最底部,需要用到的包DD_belatedPNG_0.0.8a.js自己网上下载吧 代码走起 /*在文档底部加入以下代码*/ &l ...

  9. 【已解决】Windows下 MySQL大小写敏感 解决方案及分析

    Windows下 MySQL大小写敏感配置 zoerywzhou@163.com http://www.cnblogs.com/swje/ 作者:Zhouwan 2017-3-27 最近在window ...

随机推荐

  1. Matlab从一系列图片导出AVI视频,导出GIF动图

    平台:Win7,Matlab 2014a 从一系列图片导出AVI视频的M代码如下: clear all; % 清除变量 % 官方示例,命令窗口输入“doc VideoWriter” writerObj ...

  2. C语言中free函数是如何确定要释放多少内存空间的

    本文链接:http://www.cnblogs.com/xxNote/p/4009359.html 今天看书的时候看到free函数释放动态申请的内存时只需要把内存块的首地址传过去就行了,显然仅仅依靠首 ...

  3. C++ 关键字 explicit, export, mutable

    转自 explicit 如果A类有某个构造函数的单个输入参数,是B类(包括基本数据类型)的对象或引用,则C++的编译器会在需要A类形参的函数调用中,自动调用该构造函数,将B类实参隐式地转换为A类实参. ...

  4. CUBRID学习笔记 25 数据类型2

    ---恢复内容开始--- 6枚举类型 语法 <enum_type> : ENUM '(' <char_string_literal_list> ')' <char_str ...

  5. 简单插入排序(C++版)

    #include <iostream> using namespace std; /** \ Insert Sort * * Key: * * reserve: tm = a[i] * * ...

  6. poj3692

    首先这道题很容易想到二分图相关(给的很明确了): 但是我们发现,男孩之间都互相认识,女孩之间也互相认识 这样是不能划分点集的 但是男孩之间都互相认识,女孩之间也互相认识,所以男孩和男孩,女孩和女孩之间 ...

  7. Java IO流以及装饰器模式在其上的运用

    流概述 Java中,流是一种有序的字节序列,可以有任意的长度.从应用流向目的地称为输出流,从目的地流向应用称为输入流. Java的流族谱 Java的 java.io 包中囊括了整个流的家族,输出流和输 ...

  8. SQL的自增列重置的方法

    SQL的自增列挺好用,只是开发过程中一旦删除数据,标识列就不连续了 写起来 也很郁闷,所以查阅了一下标识列重置的方法 发现可以分为三种: --- 删除原表数据,并重置自增列 truncate tabl ...

  9. ssh和ejb的区别

    转自:https://zhidao.baidu.com/question/137154342.html SSH(Struts,Spring,Hibernate) Struts进行流程控制,Spring ...

  10. python3.4用循环往mysql5.7中写数据并输出

    #!/usr/bin/env python # -*- coding:utf-8 -*- # __author__ = "blzhu" """ pyt ...