[英]D3 svg-path transition wiggles around (inclusive jsfiddle)
我想使用d3.js在rect和圓之間進行過渡。
我的嘗試在這里: http : //jsfiddle.net/8kxBW/1/
但是對我而言,這種過渡看起來並不順利。 有誰知道如何改善過渡?
有沒有簡單的方法可以做到這一點?
var circleDAttribute = "m4,15.75c0,-6.90608 5.59392,-12.5 12.5,-12.5c6.90608,0 12.5,5.59392 12.5,12.5c0,6.90608 -5.59392,12.5 -12.5,12.5c-6.90608,0 -12.5,-5.59392 -12.5,-12.5z";
var rectDAttribute = "m1.75,1.75l0,40l80.25,0l-0.25,-40l-80,0z";
d3.select("#pathTransition")
.append("svg").append("g")
.attr("transform","translate(60,60)")
.append("path")
.attr("d",rectDAttribute)
.transition()
.duration(3000)
.attr("fill","blue")
.transition()
.duration(8000)
.attr("d",circleDAttribute);
通過超級公式資源管理器,您可以在這些形狀和更多形狀之間進行轉換。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.