2014-04-14 3 views
0

내가 지금처럼 내 축의 폭을 업데이트하기 위해 노력하고있어 변화 폭 :d3.js - 업데이트 축과 경로

제로 폭

초기 설정 :

var x2 = d3.scale.linear() 
     .domain([0, 10]) 
     .range([0, 0]) 
     .clamp(true); 

svg.append("g") 
     .attr("class", "x axis2") 
     .attr("transform", "translate(0," + height/2 + ")") 
     .call(d3.svg.axis() 
      .scale(x2) 
      .orient("bottom") 
      .tickFormat(function(d) { return d; }) 
      .tickSize(0) 
      .tickPadding(12)) 
     .select(".domain") 
     .select(function() { return this.parentNode.appendChild(this.cloneNode(true)); }) 
     .attr("class", "bar-highlight"); 

나중에 내가 업데이트 할 경로의 너비 (멋진 전환으로) 좋을 것입니다. 이 answer에서 제안처럼 나는 행운과 그것을 시도 :

x2 = d3.scale.linear() 
     .domain([0, data.page_count]) 
     .range([0, 15]) 
     .clamp(true); 

d3.selectAll("g.x.axis2") 
     .call(x2); 

답변

1

당신은 단지 x2, 축에 d3.svg.axis().scale(x2)를 호출해야합니다. 다음 업데이트 절차는 저에게 유용합니다 (빈 플롯 임에도 불구하고) :

// Update the range of existing variable, x2 
x2.range([0, 15]); 
// Select and change the axis in D3 
d3.selectAll("g.x.axis2") 
    .call(d3.svg.axis().scale(x2));