HighChartsエクスポート機能
-
26-10-2019 - |
質問
SVGチャートを自動的に作成し、HighacartsチャートのJPEGまたはPNG画像バージョンを同時にエクスポートする方法を知っている人はいますか(できればオンに $(document).ready
)?
SVGバージョンを表示して画面を表示し、PNGまたはJPEGを非表示のDIVに入れて印刷したいと思います。
前もって感謝します。
解決
私のソリューションは、ユーザーが個別にエクスポートする必要なく、ページ/ダッシュボード(開始状態)のすべてのチャートのSVGの同等の画像を自動的に作成します。これにより、ページ上のすべてのHighChartsグラフとチャートが正しく印刷でき、ユーザーのインタラクションは必要ありません。
HighChartsチャートを持つページが正しく印刷されない理由は、チャートがSVGを使用して作成され、一般的なブラウザの現在のバージョンがSVGの印刷をサポートしていないためです(2012年1月書かれた)。したがって、私の解決策は、彼らがそうするとき、無関係になります。
私のソリューションは、この現在のブラウザの制限を回避します。
まず、ハイチャートを修正しました exporting.js
ユーザーが画像のエクスポートを手動で選択したときに通常トリガーされるルーチンを自動的にトリガーするためにファイル。
次に、ユーザーが手動で画像のエクスポートを選択すると、ページ全体のヘッダー要求としてリクエストが送信されることに注意することが重要です。
したがって、エクスポート関数の私の修正は、HighChartsデータを直接投稿するのではなく、最初にSVGおよびHighChartsが私のページ/ダッシュボードでDivする必要がある他の必要なデータを投稿します。
リクエストを受信する各divには、ルーチンのphpファイルが含まれています json_encodes
エクスポートルーチンから受信した投稿データは、それを独自のヘッダーとしてHighChartsエクスポートサーバーに投稿します。
したがって、投稿はそのdivからトリガーされるため、結果はそのdivのヘッダーとしてそのdivに直接送り返されます。
そのdivに送り返されたら、画像を保存し、divをCSSを介してのみ印刷し、そのdivの唯一のHTML出力は画像ファイルパスのIMGタグでした。
私はすべてのdivに彼らの画像を使用して入力するようにトリガーしました $(document).ready
.
これを試している他の人への1つのメモは、私の開発サーバーとライブサーバーの構成が異なっていたこと、つまり私がしなければならなかったことを意味します。 stripslashes
HighChartsに送信する前に、そのうちの1人にJSON。
次の投稿では、これを正しい方向に実行しようとしている他の誰かが指摘します。
Googleチャート画像をPHPを使用してファイルに保存します
divへの投稿: