How to make SVG chart responsive?

Question

JavaScript

Good day. It is not possible to add adaptability to the chart made according to this example bl.ocks.org/mbostock/3883245 I tried to set percentages for the pixel space, but nothing came of it.

Answer 1

Place the graph in a container, and set the container to:

overflow-x: scroll;
overflow-y: none;
width: 100%;

The graph itself will not decrease, but if it does not fit into the screen, it can be scrolled. But better find with built-in adaptability.

Answer 2

codepen.io/anon/pen/aZOZmM
We remove the width and height in the markup in the svg,
and transfer their values ​​​​to the viewbox and write the percentage width in css