为什么不'这个简单的attrTween例子行得通吗
Why doesn't this simple attrTween example work?
我正在努力理解attrTween。我知道做这个正方形移动的简单方法就是使用attr,但这个例子的目的是让我理解attrTween。下面的例子没有任何作用,但控制台中也没有出现js错误,所以我不确定哪里出了问题。
var svg = d3.select("svg")
var pi = Math.PI;
var mySquare=svg.append("rect")
.attr("x",60)
.attr("y",60)
.attr("width",200)
.attr("height",200);
mySquare.transition()
.duration(2000)
.attrTween("x", d3.interpolate(60,400))
下面是示例的实时编码链接:http://livecoding.io/5037197
从API:">tween的返回值[emphasis added]必须是一个插值器:一个函数…">
这里有一个方法,带有一个内联函数。
http://jsfiddle.net/TsMgJ/2/
mySquare.transition()
.duration(2000)
.delay(500)
.attrTween("x", function (d, i, a) {
console.log(a); // returns 60, the value of "x" at the start
return d3.interpolate(a, 400);
});
这里是另一种方法,它的函数在链接之外。
http://jsfiddle.net/tz5KT/1/
mySquare.transition()
.duration(2000)
.delay(500)
.attrTween("x", myTweenFunction );
function myTweenFunction(d, i, a) {
console.log( a ); // returns 60, the current value (value at start)
return d3.interpolate(a, 400);
}
相关文章:
- 应用程序的最佳目录结构 - 节点 + 道场:这行得通吗?
- jQuery中的JavaScript函数参数.这行得通吗
- 为什么不'这行得通吗?它涉及cookie、函数和参数
- D3.js attrTween 返回 null(意外行为)
- 未调用 attrTween 函数
- Angular是Unchanged-为什么不;It’这总是行得通的
- d3-transition attrTween, styleTween方法在d3版本4中不会被触发
- 为什么不'这个简单的attrTween例子行得通吗
- JavaScript:Why Won'这行得通吗
- 外部js是如何工作的?从我读到的情况来看,这应该行得通,为什么不行得通呢?