[Solved]-IE11 does not accept SVG height and width when using D3-d3.js

I got it working in the IE in the following way:

<svg id="yourid" width="100%" height="100%" viewBox="750 0 2500 2500">

The style was appended with a js-script. Here a very very old version of one of my projects: link.

var svg = d3.select("#someid")
            .append("svg")
            .attr("width", "100%")
            .attr("height", "100%")
            .attr("id", "yourid")
            .attr("viewBox", "750 0 2500 2500");

Try this. For me it fixed it for IE and Chrome:

<svg version="1.1" width="1936px" height="1056px" viewBox="0 0 1936 1056" >

Instead of providing sometimes unknows widths and heights we can use Viewport percentage as:

style='width:100vw; height:100vh;'

IE has a bug where it doesn't scale the SVG properly if you don't provide both the width and height.

To fix that issue, you can use the <canvas> trick.

https://jsfiddle.net/4p73n364/12/

I'm not a d3 user, so I can't help you with the tiny labels issue.