关于IE8使用highcharts不兼容及报error #27错误的解决方法

在使用IE8使用highhcarts展示3D图表的时候,一直报error #27的错误,猜测应该是浏览器版本不兼容的问题,但是没有具体的报错说明文档,打开源码查看:

H.getStyle = function(el, prop, toInt) {

            var style;

            // For width and height, return the actual inner pixel size (#4913)
            if (prop === 'width') {
                return Math.min(el.offsetWidth, el.scrollWidth) -
                    H.getStyle(el, 'padding-left') -
                    H.getStyle(el, 'padding-right');
            } else if (prop === 'height') {
                return Math.min(el.offsetHeight, el.scrollHeight) -
                    H.getStyle(el, 'padding-top') -
                    H.getStyle(el, 'padding-bottom');
            }

            if (!win.getComputedStyle) {
                // SVG not supported, forgot to load oldie.js?
                H.error(27, true);
            }

            // Otherwise, get the computed style
            style = win.getComputedStyle(el, undefined);
            if (style) {
                style = style.getPropertyValue(prop);
                if (H.pick(toInt, prop !== 'opacity')) {
                    style = H.pInt(style);
                }
            }
            return style;
        };

可以看到红色标记,错误是从这里发出的,谷歌后了解,getComputedStyle这个函数,谷歌,火狐支持,但是ie是不支持的,所以修改代码去解决这个问题就有点大题小做了,毕竟我只用它的一个功能,没必要去重写源码以及做一堆的兼容调试。

打开highcharts的官网点击打开链接,兼容部分,有这么一段:

Highcharts 6
从 Highcharts 6.0.0 开始,我们将兼容低版本 IE 的代码单独成一个模块文件,这样用户可以根据需求是否加载对应的文件,可以减少在主流浏览器上加载代码的大小,推荐以下面形式加载这个文件:

<script src="https://img.hcharts.cn/highcharts/highcharts.js">
<!-- 其他 Highcharts 需要的文件 -->

<!--[if lt IE 9]>
<script src="https://img.hcharts.cn/highcharts/modules/oldie.js"></script>
<![endif]-->

其实在6.0版本以后就已经添加了对低版本浏览器的支持,只需要在html或者jsp界面引用红色部分字体就可以,oldie.js这个文件里有关于对低版本ie浏览器的支持。

大部分情况添加这个文件后兼容问题就已经解决了,但是有时图表展示还是报错:“该对象不支持此属性或方法”

此时需要在jsp或html文件最上方添加如下两行代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

在js文件里对逗号要求比较严格,多的少的都会报错,定义图表展示<div>需要加上height属性固定,

问题基本就解决了。

阅读更多

没有更多推荐了,返回首页