호출 svg.selectAll (X) .data(). enter() multiple times

축에 틱을 그리는 drawticks 함수가 있습니다. 틱은 좌표가있는 데이터 구조에서옵니다. 틱 [0]은 가장 거친 곡물의 틱입니다. 진드기 [4] 또는 가장 높은 항목이 무엇이든간에 가장 미세한 입자의 진드기가 있습니다. 지금은 틱 0 만 그립니다.호출 svg.selectAll (X) .data(). enter() multiple times

function drawTicks(axis, width) { 
    svg.selectAll("line") 
    .data(data[axis].ticks[0]) 
    .enter().append("line") 
    .attr("stroke", "pink") 
    .attr("stroke-width", 2) 
    .attr("fill", "none") 
    .attr("x1", function (d) { 
     return xScale(d.x); 
    }) 
    .attr("y1", function (d) { 
     return h - yScale(d.y); 
    }) 
    .attr("x2", function (d) { 
     return xScale((d.x + (width * d.dx))); 
    }) 
    .attr("y2", function (d) { 
     return h - yScale((d.y + (width * d.dy))); 
    }); 
}

각 축마다 별도로 테스트하기 위해 콘솔에서 이것을 호출했습니다. 그것은 비 결정적으로 행동합니다. 때로는 두 번째 축과 두 번째 축에 틱을 두 번째로 호출 할 때 응답이 없습니다.

하나의 루프를 하나씩 호출하는 대신 모든 축을 반복하는 for 루프를 원하지만이 방법은 콘솔에서 작동하지 않는 것과 같은 이유로 작동하지 않습니다.

대신 data()를 사용하는 대신 svg.append (line)를 사용할 수 있음을 알고 있습니다. enter()하지만 d3 규칙을 사용하면 점을 반복하는 대신 데이터를 사용하게됩니다. 내 데이터 구조에서.

출처

2013-11-27 tuna

모든 속성을'enter()'선택에 적용합니다.이 속성은 후속 호출에서 다음과 같은 틱을 업데이트하지 않습니다. 이전 통화에서 이미 생성되고 스타일이 지정되었습니다. 'var ticks = svg.selectAll ("line"). 데이터 (데이터 [축]. 틱스 [0])'와 같이 var에 선택을 할 당해야하고,'ticks.enter(). append ('line ')'(획을 설정하고 여기에 칠할 수 있음). 그런 다음 나머지 속성을'ticks'에 적용합니다 ('enter()'없이). – meetamit

나는 이것을 시도 할 것이다, 그러나 나는 아직도 대답을 정말로 이해하지 못한다. 우리는 세 가지 문으로 코드를 배포 할 경우 , VAR 틱 = 등 ... ticks.enter()와 ticks.attr (등 등 등), 그게 제외하고 원래보다 의미 다르다 표시되지 않습니다 나눠지기 위해서. – tuna

확인. 다른 줄을 덮어 쓰지 않으려면 여기 내 마지막 코드가 있습니다 :

function drawTicks(level, axis, wid){ 

var myClass = "axis"+axis+"-level"+level; 
    svg.selectAll("."+"myClass") 
     .data(data[axis].ticks[level]) 
     .enter() 
     .append("line") 
     .attr("stroke", "pink") 
     .attr("stroke-width", 2) 
     .attr("fill", "none") 
     .attr("class", myClass) 
       }

출처

2013-11-27 02:54:34 tuna

문제가 해결 되었습니까? –

호출 svg.selectAll (X) .data(). enter() multiple times

답변

관련 문제