2014-05-13 8 views
2

희망이 나를 도울 수에 고정 된 줄을 코드 추가, 그것의 거의 동일한 문제 (더 선이 표시되지 않습니다으로 표시되지 않습니다 완료하기 위해) :하드 D3 막대 차트

d3.js How to add lines to a bar chart

차이가 있다면 예를 들어 7 %의 하드 코드 된 참조 선을 만들어야합니다.

여기에 피들 작성을 시도했지만 표시 할 줄을 가져올 수 없습니다.

http://jsfiddle.net/ComputerSaysNo/sstSe/1/

나는 그것이이 변경하여 수행 할 수있는 상상 ...?

bars.append("line") .attr("x1", 0) .attr("y1", function(d,i) { return height - d.average; }) .attr("x2", 10) .attr("y2", function(d,i) { return height - d.average; });

많은 감사,

라이언.

+0

'bars'에 추가하지 않고'svg'에 추가하십시오. 또한 좌표를 올바르게 설정해야합니다. http://jsfiddle.net/sstSe/3/ –

+0

친절하게 감사합니다. @LarsKotthoff Perfect! – Ryan

답변

2

막대의 선택 인 bars 변수에 줄을 추가합니다. 이 줄을 SVG에 추가해야합니다.

svg.append("line") 
    .style("stroke", "black") 
    .attr("x1", 0) 
    .attr("y1", y(0.07)) 
    .attr("x2", width) 
    .attr("y2", y(0.07)); 

이렇게하면 좌표가 올바르게 설정됩니다. 선에 연결된 데이터가 없으므로 function(d) { ... }은 작동하지 않습니다.

완료 데모 here. 불필요하고 깨진 코드도 삭제했습니다.