在d3.js中使用svg图像沿直线拖动

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

var line = svg.append("line")
              .attr("x1", 100)
              .attr("y1", 100)
              .attr("x2", 400)
              .attr("y2", 100)
              .attr("stroke", "black");

var image = svg.append("image")
               .attr("xlink:href", "image.jpg")
               .attr("x", 50)
               .attr("y", 80)
               .attr("width", 100)
               .attr("height", 100)
               .call(d3.drag()
                       .on("drag", dragHandler));

function dragHandler() {
  image.attr("x", d3.event.x)
       .attr("y", d3.event.y);
}