Internet Explorer で SVG シンボルが正しく拡大縮小されないのはなぜですか?

IE で SVG シンボルが適切に拡大縮小されない: 追加のスペース

Internet Explorer には、幅と高さの両方の属性がないと SVG が不適切に拡大縮小されるという長年のバグがあります。

解決策

A を含むトリックを使用する解決策が存在します。要素。IE は適切にスケーリングします。 を配置します。

<div> を含む内の SVG と同じアスペクト比を持つ。正しい SVG サイズを確保します。

<div>

CSS

canvas {
  display: block;
  width: 100%;
  visibility: hidden;
}

svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}