Javascript 如何绘制垂直面积图？

如何在d3中绘制垂直区域？ 就像我画的红色：

---

这里最好的方法是什么？我在网上找不到任何例子。

事实上，正如你所说，大多数面积图的例子（我想说几乎所有的例子）都使用水平面积，也就是说，基线是水平的

然而，使用D3创建垂直面积图（即具有垂直基线）非常容易。要做到这一点，我们必须使用较不知名的

x1

和

x0

方法

由于几乎所有在线示例都是水平面积图，因此面积生成器的方法只有

x

、

y1

和

y0

。然而，同样的方法

x

单独将

x0

设置为值，将

x1

设置为

null

，

y

将

y0

设置为值，将

y1

设置为

null

也就是说，您只需要使用

x0

设置垂直基线。检查此示例：

const svg=d3.选择（“svg”）；
常量数据=[0,80,20,210,130,270,30,110,130,0]；
const area Generator=d3.面积（）
.x0（0）
.x1（d=>d）
.y（（u，i）=>i*15）
.curve（d3.curveMonotoneY）
const area=svg.append（“路径”）
.attr（“d”，区域生成器（数据））
.样式（“填充”、“青色”）
非常感谢。我已经寻找这个解决方案几个小时了！