出于某种原因,添加过渡会破坏我的两个剪辑路径。这完美地工作:
// Append path first
var svg = d3.select(this).selectAll("svg").data([data]);
var gEnter = svg.enter().append("svg").append("g");
gEnter.append("clipPath").attr("class", "above").attr("id", "clip-above").append("path");
gEnter.append("clipPath").attr("class", "below").attr("id", "clip-below").append("path");
// Later, attach data
var g = svg.select("g")
g.select("#clip-above path").attr("d", area.y0(0));
g.select("#clip-below path").attr("d", area.y0(height));
但是如果我添加一个过渡,整个区域就会被着色area-below
:
// Later, attach data
var g = svg.select("g")
g.select("#clip-above path").transition().duration(500).attr("d", area.y0(0));
g.select("#clip-below path").transition().duration(500).attr("d", area.y0(height));
知道发生了什么吗?