1

到目前为止我所拥有的：http: //jsfiddle.net/DerNalia/GjmL7/4/

相关代码：

function mouseMove(){
  var x = 0; var y = 1;
   mouse = d3.mouse(this);
   console.log(mouse)
   // check if close to bounds
   if (mouse[x] < 10){
      console.log("shift left")
      circle.attr("cx", function (d,i) { return d.x - 5; } ) // translate x value
      text.attr("cx", function (d,i) { return d.x - 5; } ) // translate x value
      path.attr("cx", function (d,i) { return d.x - 5; } ) // translate x value
   }
   if (mouse[y] < 10){
    console.log("shift right")
      circle.attr("cy", function (d,i) { return d.x - 5; } ) // translate x value
      text.attr("cy", function (d,i) { return d.x - 5; } ) // translate x value
      path.attr("cy", function (d,i) { return d.x - 5; } ) // translate x value
   }
}

目前，当您接近屏幕边缘时，圆形节点、线条（路径）和文本都应该平移，但如果您查看小提琴，您会发现它们滚动的方向错误。

我试图完成的行为： 当用户滚动到屏幕边缘时，画布上的所有内容都应该远离光标——光标在说，“嘿，我想看看这里有什么”

但问题是（除了不知道如何翻译 svg 上的所有内容）是，一旦光标停止移动，我如何继续翻译，直到光标回到文档上？（当然，我会为翻译设置最大值和最小值，因为翻译过去的数据没有意义）

4

0 回答 0