What is the problem with D3js working with Internet explorer 11

Question

I am creating an SVG donut chart using D3js v4 library, and it works fine with Google chrome but it doesn't work at all with IE11

I tried to to put the code in this Codepen 'https://codepen.io/ohmto/pen/eYZeYqW'

any help or a reason why it doesn't work on IE11, it will be appreciated

Answer 1

I try to check your code and found => arrow functions in it. Arrow functions are not supported in the IE browser.

I try to modify your sample code and try to convert the arrow functions to normal functions to make it work with the IE browser.

After modifying the code, I noticed that the chart getting created but it is not in the proper format and data are missing too.

output in the IE 11 browser:

I again try to modify the JS and CSS code but the result was the same.

Further, I try to check the D3.JS and SVG related documents.

You can notice that SVG has partial support in the IE browser.

Some parts of D3.js may also not work with the older browsers.

You can try to simplify your sample and check whether it works with the IE. If it does not work then I suggest you use the JS code to identify the browser and inform users to visit the site using compatible browsers for your site.