Incubator-echarts: echarts.js:3066 Uncaught Error: `setOption` should not be called during main process

[Eddy-CY]

One-line summary [问题简述]

用socket.io接收数据并更新option，setoption刷新，有时候会出现错误：echarts.js:3066 Uncaught Error: setOption should not be called during main process。

Version & Environment [版本及环境]

• ECharts version [ECharts 版本]: "version": "3.2.3",
• Browser version [浏览器类型和版本]:Google chrome 版本 54.0.2840.71 m (64-bit)
• OS Version [操作系统类型和版本]:windows 7 61bit

Expected behaviour [期望结果]

了解原因及解决办法。

ECharts option [ECharts配置项]

option = {
               title: {
                    text: '位移'
                },
                tooltip: {
                    trigger: 'axis'
                },
                xAxis: {
                    data:[]/* data.map(function (item) {
                        return item[0];
                    })*/
                },
                yAxis: {
                    splitLine: {
                        show: false
                    },
                    // max:100
                },
                toolbox: {
                    left: 'center',
                    feature: {
                        dataZoom: {
                            yAxisIndex: 'none'
                        },
                        restore: {},
                        saveAsImage: {}
                    }
                },
                // dataZoom: [{
                //     startValue: '2014-06-01'
                // }, {
                //     type: 'inside'
                // }],
                visualMap: [{
                    top: 10,
                    right: 10,
                    pieces: [{
                        // gt: 0,
                        lte: 60,
                        color: '#096'
                    }, {
                        gt: 60,
                        lte: 70,
                        color: '#ffde33'
                    }, {
                        gt: 70,
                        lte: 80,
                        color: '#E9967A'
                    },{
                        gt: 80,
                        color: '#EE0000'
                    }],
                    outOfRange: {
                        color: '#999'
                    }
                }
                ],
                series: {
                    name: 'displacement',
                    type: 'bar',
                    data:[],/* data.map(function (item) {
                        return item[1];
                    }),*/
                    markLine: {
                        silent: false,
                        data: [{
                            yAxis: 60
                        }, {
                            yAxis: 70
                        }, {
                            yAxis: 80
                        }]
                    }
                }
}

Other comments [其他信息]

[100pah]

这个报错，是为了限制 setOption 调用时机，意思是如果 setOption 或者 dispatchAction 的流程没有走完，中途再调用一次 setOption 会受限。

那么，你是在什么场景/什么时机下调用的 setOption 呢？

[Eddy-CY]

就是socket.io接收到数据，更新option的数据以后就调setOption。 @100pah

[100pah]

在 setOption 之前控制台中有没有报过错？

[Eddy-CY]

没有，初始化的时候没有报错，刷新也没报错，只是有时候会出现，现在好像有没有看到了，很奇怪！会不会一张页面存在多个echarts对象的时候相互影响呀！现在又没有看到报错了！ @100pah

[pissang]

好像源代码版本在 resize 后会出现这个问题，如果是的话最新代码已经修复了

[Yaxian]

try

setTimeout(() => {
  echatsInstance.setOption([option])
}, 500)

not

  echatsInstance.setOption([option])

[AntiMoron]

@100pah 我也遇到了这个问题，有没有对应的回调通知setOption流程走完呢？

[stardustman]

官方的api有 echartsInstance.clear
清空当前实例，会移除实例中所有的组件和图表。清空后调用 getOption 方法返回一个{}空对象。
我碰到的是用ajax请求的到json数据后去更新series中的数据,但是我把实例和Option都声明成全局变量,就会报这样的错.都放在ajax函数里就不报错了.也是奇怪.

[stardustman]

[shyangs]

我也遇到這個報錯

不知道跟我用了 window.setTimeout(function(){ }); 有沒關係.

....

看了上面的討論, 暫時這樣繞過.(不知道是不是好方法)

echartsInstance.clear();
echartsInstance.setOption(option);

....

3806 , #6281 也是這樣的報錯訊息.

[sinpor]

@100pah 关于你说的限制setOption调用时机，之前我用setOption设置一个graphic，然后在graphic元素的拖拽事件处理方法中又用setOption设置另一个graphic元素是可行的，但现在改为设置series就会报这个错，求回复(o゜▽゜)o☆