在封闭div中居中并删除SVG中的空白

我在X轴上拉伸SVG时遇到了困难，因此两边都没有可见的空白。此外，我希望该点（在所附图片中用红色圆圈标记）接触第二个div的开始，背景颜色为黑色。我已尝试更改viewbox值，但无法达到预期的结果

下面是我的代码

*{
保证金：0；
填充：0；
框大小：边框框；
}
html{
字体大小：62.5%
}
身体{
字体系列：-苹果系统，BlinkMacSystemFont，'Segoe UI'，Roboto，Oxygen，Ubuntu，Cantarell，'Open Sans'，'Helvetica Neue'，Sans serif；
}
.举例{
宽度：100%；
高度：100vh；
}
svg{
宽度：100%；
身高：100%；
}
.第二节{
宽度：100%；
高度：100vh；
背景色：黑色；
}

---

要实现这一点，您需要做两件事：

确保您的

视图框

正确无误。它需要与

的尺寸相匹配。目前没有

将以下属性添加到SVG中，以关闭SVG所做的自动纵横比保持缩放

preserveAspectRatio="none"

如果我们选中路径的边界框，我们将得到以下值：

x: 2.600
y: 2.895
width: 2984.740
height: 1650.893

因此，如果希望路径接触SVG父容器的所有四个侧面，则需要设置viewBox

*{
保证金：0；
填充：0；
框大小：边框框；
}
html{
字体大小：62.5%
}
身体{
字体系列：-苹果系统，BlinkMacSystemFont，'Segoe UI'，Roboto，Oxygen，Ubuntu，Cantarell，'Open Sans'，'Helvetica Neue'，Sans serif；
}
.举例{
宽度：100%；
高度：100vh；
}
svg{
宽度：100%；
身高：100%；
}
.第二节{
宽度：100%；
高度：100vh；
背景色：黑色；
}

Hi Paul，当我在较小的屏幕上看到SVG时，图形的角度正在改变。这是因为PreserveSpectratio已关闭。如果我从代码中删除preserveAspectRatio属性，那么在较小的屏幕尺寸上，SVG将集中在div上，顶部和底部都有空格。那么，在不获取任何空白的情况下维护纵横比的解决方案是什么呢？请尝试

preserveSpectratio=“xMinYMax slice”