Javascript 无法在条上获得阴影

我正在制作一个条形图，我需要让图表看起来像这样：

以下是我尝试过的：

.attr("id", "drop-shadow")
.attr("height", "130%");

但它没有起作用

如何修复此问题？

试试这个

图表看起来和图片一样

但我并没有添加阴影

在创建条形图之前添加了

椭圆

，其效果与上述效果相同

svg.selectAll(".ellipse") .data(data) .enter() .append("ellipse") .attr("cx", function(d) { return x(d.age) + 30; }) .attr("cy", function(d) { return y(0); }) .attr("rx", 35) .attr("ry", 5) .style("fill", function(d) { return d.color2; }) svg.selectAll（“椭圆”） .数据（数据） .输入（） .append（“椭圆”） .attr（“cx”，函数（d）{返回x（d.age）+30；}） .attr（“cy”，函数（d）{返回y（0）；}） .attr（“rx”，35） .attr（“ry”，5） .style（“fill”，函数（d）{return d.color2；}） 这很简单。在创建条形图之前，需要先创建椭圆

当我们定位椭圆时，它就像一个阴影

很抱歉，我没有时间来了解酒吧的对比色。但是你当然可以修改它

如果你想做一个阴影

下面是一个需要javascript库来放置svg元素阴影的示例

希望这有帮助