Javascript d3面积图未显示

我试图创建一个d3面积图，但没有显示任何内容。 我猜xScale有问题。我可以看到一个路径被添加到DOM中，但是缺少d属性。我做错了什么

//面积图宽度和高度 常数宽度=500， 高度=100； //定义面积图的x和y比例 常量xScale=d3.scaleLinear.range[0，宽度]； 常数yScale=d3.刻度线性范围[高度，0]； //将SVG添加到areachart 常量svg=d3 。选择“区域图表” .append'svg' .attr'width'，width .attr'height'，height； const g=svg.append'g'； //获取数据 d3.json'https://data.london.gov.uk/api/table/s8c9t_j4fs2?$offset=7600' .Then函数数据{ //加载数据后定义xScale和yScale域 yScale.domain[ 0, d3.maxdata，函数D{ return+d.总病例数； }, ]; xScale.domain d3.extentdata，函数D{ return+d.新案例； } ; //面积发生器 常数面积=d3 地区 弯曲的，弯曲的 .xd=>xScale1+d.new_案例 .y0d=>yScale1d.y0 .y1d=>yScale1d.y0+d.y； console.log'data:'，data.rows； g、 选择全部'g' .数据 进来 .附加“g” .append'path' .归类为“线”，对吗 .attr'd'区域 .样式“填充”、“红色”； } //如果有错误，请记录它 .catcherror=>console.logerror；

---

你的主要问题是：

您使用了d3.maxdata，但数据不是数组。我在前一个.中获取了data.rows，然后，它修复了这个问题； 您使用selectAll，为每个数据点创建一条路径。对于面积图，实际上只需要一条路径，或者每个面积至少需要一条路径。我将其从.data.enter更改为.datum； 您使用了数据对象上不存在的值d.y0和d.y； 您没有为该区域提供笔划，仅提供填充。如果该区域没有填充，则不起作用。 我并不是说这更好，因为数据没有排序，但至少你现在看到了一些东西

//面积图宽度和高度 常数宽度=500， 高度=100； //定义面积图的x和y比例 常量xScale=d3.scaleLinear.range[0，宽度]； 常数yScale=d3.刻度线性范围[高度，0]； //将SVG添加到areachart 常量svg=d3 。选择“区域图表” .append'svg' .attr'width'，width .attr'height'，height； const g=svg.append'g'； //获取数据 d3.json'https://data.london.gov.uk/api/table/s8c9t_j4fs2?$offset=7600' .thenresponse=>response.rows .Then函数数据{ //加载数据后定义xScale和yScale域 yScale.domain[ 0, d3.maxdata，函数D{ return+d.总病例数； }, ]; xScale.domain d3.extentdata，函数D{ return+d.新案例； } ; //面积发生器 常数面积=d3 地区 弯曲的，弯曲的 .xd=>xScale+d.new_案例 .yd=>yScale+d.总例数； g、 附加“g” .datumdata .append'path' .归类为“线”，对吗 .attr'd'区域 .样式“笔划”、“红色” .样式“填充”、“红色”； } //如果有错误，请记录它 .catcherror=>console.logerror； 让我们。