附加 'tr' 标签时使用 R2D3.js 的 IE8 中的参数无效

Invalid Argument in IE8 using R2D3.js when appending 'tr' tag

我有一个使用 D3.js 的应用程序,但我必须使其与 IE8 兼容...所以我使用了 R2D3.js,这似乎是一个非常好的 SVG 操作替代方案.但是对于基本标签...

我用它来管理 table 中的数据,但是当要追加新行时,IE 说:

Line: 8450 / Error: Invalid argument.

我环顾四周,但没有发现任何线索。

这是我的代码的一个简单示例:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <!--[if lte IE 8]><script src="r2d3.js" charset="utf-8"></script><![endif]-->
        <!--[if gte IE 9]><!-->
        <script src="d3.min.js" charset="utf-8"></script>
        <!--<![endif]-->
    </head>

    <body>
        <table>
        </table>

        <script>
var dataset = [
    {
        name: 'Foo',
        age: 42
    },  
    {
        name: 'Bar',
        age: 21
    }
];

var table = d3.select('table');
table.selectAll('tr').data(dataset)
    .enter().append('tr')
    .selectAll('td')
        .data(function(d) {
            return [d.name, d.age];
        })
        .enter().append('td')
            .text(function(d) {return d});
        </script>
    </body>
<html>

这与 Firefox 完美配合,但在 IE8 上崩溃。

这里是JSFiddle.

谁能帮我解决这个问题?

谢谢。

查看 R2D3 源代码,它使用了仅从 IE9 开始支持的 addEventListener 方法:

https://github.com/mhemesath/r2d3/search?utf8=%E2%9C%93&q=addeventlistener

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener

R2D3Element.prototype.addEventListener = function(type, listener) { 
    this.domNode.childNodes[i].r2d3.addEventListener(type, listener); 
} 

这解释了它在 IE8 上崩溃的原因