如何在d3折线图中的线条上创建点(散点图)

var svg = d3.select("body")
  .append("svg")
  .attr("width", width)
  .attr("height", height);

var line = d3.line()
  .x(function(d) { return xScale(d.x); })
  .y(function(d) { return yScale(d.y); });

svg.append("path")
  .datum(data)
  .attr("class", "line")
  .attr("d", line);

var scatter = svg.selectAll("circle")
  .data(data)
  .enter()
  .append("circle")
  .attr("class", "dot")
  .attr("cx", function(d) { return xScale(d.x); })
  .attr("cy", function(d) { return yScale(d.y); })
  .attr("r", 4);