javascript - 如何平滑 svg 路径

Question

我正在使用 d3.js v6 使用路径创建形状。我有要点来绘制它。下面是我创建的部分形状的图像。问题是该部分不是一条平滑的曲线，我需要一条没有锐利边缘的平滑路径。怎么做？

这是用于创建形状的代码

const ordered = this.orderSequence(footData);
    const first = ordered[0];
    ordered.push(first);
    const line = d3
      .line()
      .x((d, i) => {
        return this.xScale(ordered[i].x);
      })
      .y((d, i) => {
        return this.yScale(ordered[i].y);
      });

    const g = this.svgInner.append("g");

    g.append("path")
      .attr("d", line(ordered))
      .style("stroke", "#1c1c1c")
      .style("stroke-width", "1px")
      .style("shape-rendering", "geometricPrecision")
      .style("fill", "none");

标签： javascripthtmlcssangulard3.js