D3.js D3有界拖动

我在SVG中有一条可拖动的线（大约300px）。我的目标是限制线可以移动的距离，以便它不会超出SVG。我使用d3大约一个小时了，所以非常感谢您的帮助

我之前尝试过使用一些if语句，但都不起作用。这是我的密码：

var svg = document.getElementById("probabilityDensitySVG");
var drag = d3.behavior.drag()
    .on('dragstart', null)
    .on('drag', function(d){
var dx = d3.event.dx;
var dy = d3.event.dy;
var x1New = parseFloat(d3.select(this).attr('x1'))+ dx;
var y1New = parseFloat(d3.select(this).attr('y1'));
var x2New = parseFloat(d3.select(this).attr('x2'))+ dx;
var y2New = parseFloat(d3.select(this).attr('y2'));
line.attr("x1",x1New)
 .attr("y1",y1New)
 .attr("x2",x2New)
 .attr("y2",y2New);
}).on('dragend', function(){
}); 

var line = d3.select(svg)
  .append("line")
  .attr("x1",100)
  .attr("y1",143)
  .attr("x2",100)
  .attr("y2",370)
  .attr("stroke-width",5)
  .attr("stroke","black")
  .call(drag);

---

可以使用嵌套的三元运算符检查边界

例如，在x坐标中限制

50

和

300

之间的阻力：

x1New = dx > 300 ? 300 : dx < 50 ? 50 : dx;

谢谢！这正是我想要的。语法的一个例子非常有用。@allegro我看到你发布了另一个问题，而且你在S.O.非常新。因此，这里有一个提示：除非你承认一个有用的答案，否则人们会停止回答你的问题（我的意思是，这是我通常做的）。谢谢提醒！我已经有一段时间没有这么做了。