Javascript 使用D3动态生成这样的设计有机形状？

当我在另一个项目中使用d3雷达图时，我注意到当在极线上使用基插值时，我得到了一条非常平滑的曲线，类似于一个有机形状，我想知道有没有一种方法可以用d3.js实现这一点，我想要的形状是：

---

像这样的=

卡片https://i.stack.imgur.com/EK1my.png?s=128' 卡片https://i.stack.imgur.com/EK1my.png?s=128' 卡片https://i.stack.imgur.com/EK1my.png?s=128' 函数cardurl{ 设s=500；//大小 设步长=100；//x轴步长 设范围=[-50，50]；//y轴范围 //将新svg添加到document.body，其原点为0 让svg=d3。选择“body” .append'svg' .attr'viewBox'，'0${s}${s}`； //用于形成遮罩形状的点的插值算法 设直线=d3.0直线 .curved3.curveCardinalClosed； //随机值发生器函数 设rnd=d3.0.0，范围； //图像优先 appendsvg:image .attr'mask'，'urlmask' .attr'width'，s .attr'height'，s .attrxlink:href，url //这里我用固定的'step'和'x'轴放置点 //和y轴上的“范围”中的随机值 //它形成了原始路径 设pts=d3.range-1，s/step+2.mapi=>[i*step，rnd]； //从原始路径向下移动点， //移位量取决于点索引 设pts1=pts.mapp，i=>[ p[0]，p[1]+s*0.3-i*s*0.08 ]; //上的原始点和换档点的相反顺序 //更大的值，取决于点索引 设pts2=pts.reverse.mapp，i=>[ p[0]，p[1]+s*0.8-i*s*0.03 ]; //为所有对象形成单插值路径 //在单个数组中连接上一步的点 设d=linepts2.concatpts1； //附加大小为视口且孔由插值路径形成的矩形 //使用hsl调色板中的随机颜色，不透明度为0.9 svg.append'path' .attr'opacity'，0.9 .attr'fill'，'hsl${Math.random*255}，55%，55%` .attr'd'，`M0,0v${s}h${s}v${-s}z${d}` } svg{ 高度：150像素； 利润率：10px； 盒影：0 2px 10px 2px浅灰色； }

---

非常感谢。就相似性而言，它是完美的！很高兴知道代码的某些片段是什么，如果我愿意，我可以处理它并进行调整@santih抱歉，我错过了你的评论，我会很快添加评论