如何使绘图条形图显示堆栈的颜色，而不是轨迹的颜色

// 引入D3.js库
<script src="https://d3js.org/d3.v7.min.js"></script>

// 准备数据
var data = [
  { category: "A", part1: 10, part2: 20, part3: 30 },
  { category: "B", part1: 15, part2: 25, part3: 35 },
  { category: "C", part1: 20, part2: 30, part3: 40 }
];

// 设置堆栈属性
var stack = d3.stack().keys(["part1", "part2", "part3"]);
var stackedData = stack(data);

// 创建绘图区域
var svg = d3.select("body").append("svg")
  .attr("width", 500)
  .attr("height", 300);

// 设置颜色比例尺
var color = d3.scaleOrdinal()
  .domain(["part1", "part2", "part3"])
  .range(["#ff0000", "#00ff00", "#0000ff"]);

// 绘制条形图
svg.selectAll("g")
  .data(stackedData)
  .enter().append("g")
  .attr("fill", function(d) { return color(d.key); })
  .selectAll("rect")
  .data(function(d) { return d; })
  .enter().append("rect")
  .attr("x", function(d) { return xScale(d.data.category); })
  .attr("y", function(d) { return yScale(d[1]); })
  .attr("height", function(d) { return yScale(d[0]) - yScale(d[1]); })
  .attr("width", xScale.bandwidth());