如何将SVG路径调整为7.58×16.62的尺寸规格？

现有19×19px的SVG图标，内部Path当前尺寸为15.21×7.16，需调整为宽度7.58、高度16.62的规格，以下是具体实现步骤和修改后的代码：

核心调整逻辑 #

1. 明确原Path的包围盒范围：x轴从1.01到16.22（宽度≈15.21），y轴从5.37到12.53（高度≈7.16）
2. 计算缩放比例：宽度缩放比为 7.58/15.21≈0.498，高度缩放比为 16.62/7.16≈2.321
3. 让调整后的Path在19×19的SVG viewBox中居中：SVG viewBox中心为(9.5,9.5)，因此目标Path的包围盒x范围是9.5±3.79，y范围是9.5±8.31
4. 基于缩放比例和居中位置，转换原Path的三个顶点坐标，得到新的路径

修改后的完整代码 #

svg {
  border: 1px solid black;
  width: 19px;
  height: 19px;
}

div {
  margin-left: 10px;
  width: 170px;
  height: 170px;
}

<svg width="19" height="19" viewBox="0 0 19 19" fill="none" xmlns="http://www.w3.org/2000/svg">
    <path d="M5.71 1.19L9.4 17.81L13.28 1.19" stroke="#111111" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

说明 #

调整后的Path保留了原有的倒V形状，尺寸符合要求且在19×19的SVG容器中居中显示。如果需要更精确的坐标，可以基于缩放比例重新计算顶点值。

内容的提问来源于stack exchange，提问作者user20477527