새 창 IE8에서 하이 차트 렌더링 안 함

Question

JavaScript를 통해 하이 차트 차트를 인쇄하려고합니다. 요구 사항 중 하나는 인쇄가 별도의 창에서 수행되어야하는데, 이는 Highchart에 포함 된 .print() 함수를 사용할 수 없다는 것을 의미합니다. 그래서 내가 한 일은 하이 차트 용 컨테이너를 복제 한 다음 새 창으로 보내는 것입니다. Chrome, Firefox, IE9/10에서는 정상적으로 작동하지만 IE8에서는 축 만 렌더링됩니다.

크롬 :

IE8 : 나는 유사한 문제와 Highcharts에 대한 버그 리포트를 발견

: https://github.com/highslide-software/highcharts.com/issues/1560

보고서에 따르면 문제입니다 내가 사용하지 않는 IE8 호환성 모드입니다. IE9/IE10, Chrome 또는 Firefox에는이 문제가 없습니다.

다음은 마크 업을 새 창에 보내는 코드입니다. '/ print'는 몇 가지 필수 CSS 파일을 포함합니다. 왜 이벤트 핸들러가 그렇게 붙어 있는지 나는 확신 할 수 없다. 방금 설명을 듣지 않고 이유없이 그렇게했다고 들었습니다.

var clone = $('#highcharts-demo').clone().get(0); 

var params = [ 
    'width='+screen.width, 
    'height='+screen.height 
].join(','); 

var printWindow = window.open('/print', 'Print', params); 
printWindow[printWindow.addEventListener ? 'addEventListener' : 'attachEvent'](
    (printWindow.attachEvent ? 'on' : '') + 'load', function() { 
    printWindow.document.body.innerHTML += clone.outerHTML; 
    printWindow.document.close(); 
    printWindow.focus(); 
}, false); 

Answer 1

문제는 jQuery.clone()에 있다고 생각합니다. 나중에

var clone = document.getElementById('highcharts-demo'); 

그리고 : "고정"할 수 있습니다 IE에서 SVG 인쇄 버그가 있다는 것을

printWindow.document.body.innerHTML += clone.innerHTML; 

Answer 2

주 나는 왜 불행하게도 .. 그러나 여기에 노력하고 해결책을 모르는 다음 CSS의 :

svg { position: absolute !important }

가 사용자의 특정 문제에 얼마나 관련 몰라,하지만 난 내 자신의 문제와 그 CSS에 대한 솔루션을 찾고 때이 문제가왔다 바로 그 수정이었다.