在IE下, 初始化zrender失败导致echart图表无法显示

[shikelong]

环境

• windows 10
• ie 11
• "echarts": "^3.1.10",

浏览器报错

···bash
SCRIPT65535: Invalid calling object

报错点 Animation.js (181,1)

···js

 start: function () {
            var self = this;

            this._running = true;

            function step() {
                if (self._running) {

                    requestAnimationFrame(step);

                    self._update();
                }
            }

            this._time = new Date().getTime();
            requestAnimationFrame(step);
        }

运行requestAnimationFrame这个方法的时候就会报错

谢谢。

[pissang]

我无法在 IE 11 上复现这个问题，你看下是不是有其它库覆盖掉了 requestAnimationFrame 这个方法

[shikelong]

恩 应该是其他库的原因 我在没有其他ui库的纯净环境下试了试是可以再ie11上出来的。

[shikelong]

https://msdn.microsoft.com/library/gg622930(v=vs.85).aspx

使用 window.requestAnimationFrame(step) 调用就没有问题了。
使用requestAnimationFrame(step)调用会报错。

[shikelong]

使用 requestAnimationFrame=window.requestAnimationFrame.bind(window) 即可修复这个问题

[shikelong]

这个问题确实挺诡异的 我引用的其他库没有重写这个原生方法的

[shikelong]

[shikelong]

建议修改zrender这块的代码以增强在ie下的兼容性。 使用 requestAnimationFrame=window.requestAnimationFrame.bind(window) 来写的话不适应与js的严格模式。

[shikelong]

https://www.bountysource.com/issues/8152579-scroll-not-working-on-ie11

[kinglywork]

如果你是在webpack中使用echarts，则webpack的config中devtool设置为含有eval时，可以重现该问题

zloirock/core-js#62

把devtool设置为不含有eval的方式即可

[airwin]

感谢分享，遇到了同样的问题

[ChaoYuLeo]

万分感谢，我也遇到了同样的问题。

[tongjun741]

遇到了同样的问题,关注中

[Roscoe93]

同样的问题，使用eval-source-map,requestAnimationFrame会报错

[Neilxzn]

同样遇到这样的问题关注中

[pissang]

赞 @shikelong

[nianhua110]

如何解決的呢，我用的echarts-for-react 依然存在這個問題。

[DanielWLam]

@shikelong 你那方法也太投机了吧，人家requestAnimationFrame本身做了浏览器兼容性处理，你倒好，直接window.requestAnimationFrame？

[shikelong]

@DanielWLam 我没有细看zrender的代码。具体怎么解决这个问题当然是看pissang怎么改。

至于我们的临时的解决方式。 webpack devtools的配置中不要使用eval选项即可。

[100pah]

另外记录下这个解答链接：http://www.foreverpx.cn/2017/03/04/echarts_webpack_ie/