vue项目中使用echarts图表,图表需根据不同搜索条件重新渲染。
问题:图表并没有完全重新渲染,或者说渲染后图表中还会看到上一次的数据。假如上一次渲染出十条数据,这次渲染出六条数据,但是显示的还是十条,前六条是本次渲染内容,后四条是上次渲染的后四条数据。
这样看来,肯定是重新渲染前需要清空数据的问题,但是数据置空的代码写了还是没能达到理想的效果。
下面是画图方法:
drawLine(){
let myChart = echarts.init(document.getElementById(‘myChart’));
myChart.setOption({
tooltip : {
trigger: ‘axis’,
axisPointer : { // 坐标轴指示器,坐标轴触发有效
type : ‘shadow’ // 默认为直线,可选为:’line’ | ‘shadow’
},
confine: true,
formatter: function (params, ticket, callback) {//自定义tooltip显示内容
var showHtm=””;
for(var i=0;i<params.length;i++) {
var color = params[i].marker;
var name = params[i].seriesName.length>20?params[i].seriesName.substring(0,19)+’…’:par