[英]d3 transition not following path
I like to make the aircraft follow the path. 我喜欢让飞机沿着这条路走。 But whatever I have tried there is a shift between the transition path and the actual drawn path on the screen.
但是,无论我尝试过什么,在屏幕上的过渡路径和实际绘制的路径之间都会发生转换。 Please look at the jsfiddle
请看看jsfiddle
d3.selectAll('.aircraft').transition()
.duration(7500)
.attrTween('transform', translateAlong(d3.select('#samplePath').node()))
function translateAlong(path) {
let l = path.getTotalLength()
// debugger
return function (i) {
return function (t) {
let p = path.getPointAtLength(t * l)
console.log(p.x, p.y)
return 'matrix(-0.359863 -0.230143 0.230143 -0.359863' + p.x + ' ' + p.y + ')'
}
}
}
您在矩阵定义中的第二个-0.359863
之后缺少空格:
return 'matrix(-0.359863 -0.230143 0.230143 -0.359863 ' + p.x + ' ' + p.y + ')'
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.