达到一定的垂直y水平时停止水平移动

Question

我是D3学习者。通过实验学习。 我得到了这段代码，每次单击都可以垂直和水平移动圆。点击“ cy”属性后，我想停止水平移动

这是我尝试过的。我们不能将if语句放在变量内吗？

var svgContainer = d3.select("#chart").append("svg").attr("id", "root")
                                     .attr("width", pbi.width)
                                     .attr("height", pbi.height).append("g")
var circle = svgContainer.append("circle")
                            .attr("id","Zubi")
                          .attr("cx", 100)
                          .attr("cy", 30)
                         .attr("r", 20)
.on("click", function() {
                    d3.select(this)
                    .transition()
                    .style("fill", "red")
                    .attr("cx",hor )
                    .attr("cy",ver )
})


function hor() {
   var self = d3.select(this)
  var add=function(){if(+self.attr('cy')> 200) { return 0} else {return 50}}
   return + self.attr('cx') + add ;
}

function ver() {
   var self = d3.select(this);
   return + self.attr('cy') + 100 ;
}