getBBox 오류 "를 사용 엄격한"<br> <code>"use strict";</code></p> <p>내 D3JS 힘 네트워크 그래프 활성화되면

Question

, 나는 코드를 사용하여 힘 네트워크 그래프의 에지 레이블 텍스트를 회전 this.getBBox();을 사용할 수 없습니다 :

를

edgelabels.attr('transform',function(d,i){ 
    if (d.target.x<d.source.x){ 
    bbox = this.getBBox(); 
    rx = bbox.x+bbox.width/2; 
    ry = bbox.y+bbox.height/2; 
    return 'rotate(180 '+rx+' '+ry+')'; 
    } 
    else { return 'rotate(0)'; } 
}); 

"use strict;"을 사용하지 않으면 내 코드가 오류없이 실행되고 레이블이 올바르게 회전됩니다. 바이올린은 : http://bl.ocks.org/jhb/5955887

어떻게 내 코드가 "use strict;" 중 하나 getBBox (과) 또는 getBBox에 대한 대안()를 사용하여 실행하도록 고정 할 수 있습니다 https://jsfiddle.net/NovasTaylor/cnaqaxnh/

나는이 블록 내 원래의 코드를 기반으로?

Answer 1

여기서 문제는 var이 아니지만 비 엄격 모드에서 선언되지 않은 변수에 할당하면 해당 변수가 전역으로 간주됩니다. 그러나 엄격 모드에서는 작동하지 않습니다.

엄격 모드에 대해 MDN page 보면 :

첫째, 엄격 모드가 불가능 실수로 전역 변수를 만들 수 있습니다. 정상적인 JavaScript에서 과제에서 변수를 잘못 입력하면 전역 객체에 대한 새 속성이 만들어지고 계속 작동합니다 (미래의 오류가 발생할 수 있음 : 현대 자바 스크립트에서는 가능). 실수로 전역 변수를 작성하는 지정은 엄격 모드로 실행됩니다. 대신에 (강조 광산) 그래서

:

edgelabels.attr('transform', function(d, i) { 
    if (d.target.x < d.source.x) { 
     bbox = this.getBBox(); 
     rx = bbox.x + bbox.width/2; 
     ry = bbox.y + bbox.height/2; 
     return 'rotate(180 ' + rx + ' ' + ry + ')'; 
    } else { 
     return 'rotate(0)'; 
    } 
}); 

그것은해야한다 : https://jsfiddle.net/onnoqyp4/

:

여기

edgelabels.attr('transform', function(d, i) { 
    if (d.target.x < d.source.x) { 
     var bbox = this.getBBox(); 
     var rx = bbox.x + bbox.width/2; 
     var ry = bbox.y + bbox.height/2; 
     return 'rotate(180 ' + rx + ' ' + ry + ')'; 
    } else { 
     return 'rotate(0)'; 
    } 
}); 

업데이트 된 바이올린입니다