如何找到d3中的最后一个数据点，并在其上绘制圆和直线？

// 创建SVG容器
var svg = d3.select("body").append("svg")
  .attr("width", 500)
  .attr("height", 500);

// 数据集
var data = [
  {x: 10, y: 20},
  {x: 20, y: 30},
  {x: 30, y: 40},
  {x: 40, y: 50}
];

// 比例尺
var xScale = d3.scaleLinear()
  .domain([0, d3.max(data, function(d) { return d.x; })])
  .range([0, 500]);

var yScale = d3.scaleLinear()
  .domain([0, d3.max(data, function(d) { return d.y; })])
  .range([500, 0]);

// 选择最后一个数据点并绘制圆和直线
var lastDataPoint = d3.select("svg").selectAll("circle:last-of-type")
  .data(data)
  .enter()
  .append("circle")
  .attr("r", 5)
  .attr("fill", "red")
  .attr("cx", function(d) { return xScale(d.x); })
  .attr("cy", function(d) { return yScale(d.y); });

lastDataPoint.append("line")
  .attr("x1", function(d) { return xScale(d.x); })
  .attr("y1", function(d) { return yScale(d.y); })
  .attr("x2", function(d) { return xScale(d.x); })
  .attr("y2", function(d) { return yScale(d.y); })
  .attr("stroke", "blue");