-1

JavaScript を使用して Highcharts チャートを印刷しようとしています。要件の 1 つは、印刷を別のウィンドウで行う必要があることです。これは、Highcharts に含まれている .print() 関数を使用できないことを意味します。それで、私がやったのは、ハイチャートのコンテナを複製してから、それを新しいウィンドウに送信することです。Chrome、Firefox、IE9/10 では正常に動作しますが、IE 8 では軸のみがレンダリングされます。

クロム：

Chrome ハイチャート

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);
4

2 に答える 2

1

問題は jQuery.clone() にあると思います。残念ながら、理由はわかりません..しかし、ここに解決策があります：

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

以降：

printWindow.document.body.innerHTML += clone.innerHTML;
于 2013-08-05T13:47:47.533 に答える