0

So as usual, internet explorer is causing compatibility issues. This time it's my tree diagram built using d3.js. My tree works in other browsers but I get the following error when I load the page in Internet Explorer 11:

SCRIPT5007: Unable to get property '0' of undefined or null reference

with a link to the line that threw the error:

d3.select(this.parentNode.children[0]).attr('height', 21 * (lineNumber + 1));

I have gone through every answer to this question as well as tried using aight.js, but to no avail. I have also tried using the meta tag <meta http-equiv="X-UA-Compatible" content="IE=Edge" /> and updated the d3.min.js script.

The only thing that loads in IE is some very broken, squashed, dysfunctional svg-looking nonsense. Any ideas?

UPDATE

Here is a JSFiddle with my code, as well as the versions of jquery and d3 i'm using.

Community
  • 1
  • 1
barnacle.m
  • 2,070
  • 3
  • 38
  • 82
  • You are going to have to show a reproducible example. I just tried a couple of the `d3` tree [layout](https://bl.ocks.org/mbostock/4339083) [examples](http://bl.ocks.org/mbostock/4063550) and don't have any issues with ie11. My guess would be that meta tag isn't taking and IE is using "compatiblity mode". In particular if you are behind a proxy/firewall, I've seen ie do crazy things with compatiblity settings. One quick test is to open ie's developer tools, go to the emulation tab and look at the document mode dropdown. Is it showing "Edge"? – Mark Mar 07 '16 at 14:26
  • Hi, I will attempt to create a jsfiddle with my code, in the mean time, no it shows Document mode "11 (Default). – barnacle.m Mar 08 '16 at 11:17

1 Answers1

0

So it turns out that Internet Explorer doesn't like parentNode.children[0]. To get the first child of parentNode use parentNode.firstChild. This makes the script compatible with IE.

barnacle.m
  • 2,070
  • 3
  • 38
  • 82