所有
我对D3转换很新,我想知道在切换数据时怎么才能在轴刻度线上应用长度转换?
我的代码就像:
var data1 = [1,2,3,4]
var data2 = [1,4,8,12]
function draw(data){
var svg = d3.select(".chart svg");
if(svg.empty()){
svg = d3.select(".chart")
.append("svg");
svg.append("g")
.classed("yaxis", true)
}
svg.attr("width", 400)
.attr("height", 300);
var axisg = svg.select("g.yaxis")
.attr("transform", function(){
return "translate(40, 20)";
})
var scale = d3.scale.linear();
scale.domain(d3.extent(data)).range([300-40, 0]);
var axis = d3.svg.axis();
axis.scale(scale).orient("left")/*.ticks(5)*/;
axisg.transition().duration(1500).ease("sin-in-out").call(axis)
.selectAll("line")
.attr("x2", 300-40)
.style("stroke", "black")
.style("stroke-width", "1px");
axisg.select("path").style("fill", "none")
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<button onclick="draw(data1)">Data1</button>
<button onclick="draw(data2)">Data2</button>
<div class="chart"></div>
&#13;