svg path根据width变大

要实现 SVG path 根据 width 变大，可以使用 SVG 的 path 元素和 JavaScript 来实现。

首先，在 SVG 中定义一个 path 元素，并设置其 d 属性为一个路径字符串，表示 path 的形状。例如：

<svg viewBox="0 0 100 100">
  <path id="myPath" d="M10 50 Q 50 80 90 50" />
</svg>

这段代码会创建一个二次贝塞尔曲线路径，起点为 (10,50)，终点为 (90,50)，控制点为 (50,80)。

接着，在 JavaScript 中获取 path 元素，并根据 width 的变化来修改 path 的 d 属性。例如：

const path = document.getElementById('myPath');
const originalPath = path.getAttribute('d');
const width = 200;

path.setAttribute('d', `M${10 * width / 100} 50 Q ${50 * width / 100} ${80 * width / 100} ${90 * width / 100} 50`);

这段代码会先获取 path 的原始路径字符串，然后根据 width 的变化来计算新的路径字符串，并设置为 path 的 d 属性。在这个例子中，我们假设 width 的值为 200，因此新的路径是起点为 (20,50)，终点为 (180,50)，控制点为 (100,160) 的二次贝塞尔曲线路径。

注意，这个例子只是一个简单的演示，实际应用中需要根据具体情况来计算路径的变化。另外，如果要实现更复杂的路径变化，可能需要使用更高级的 SVG 功能，比如 SMIL 或者 CSS 动画。