有什么办法可以将 Highcharts 与 mPDF 转换器一起使用吗？

Question

这个问题与 HTMLtoPDF 转换器有关。

mPDF 转换器与包含的 css 一起工作正常，但不适用于任何 Bootstrap Table 或任何 svg 元素。

如何在 html 中为 mPDF 包含 js？

Answer 1

mPDF 不支持 JavaScript。但是，您可以使用以下方法之一：

1. 使用类似的方法检索图表的 SVG 代码$('svg')[0].outerHTML并将其发送到服务器以作为图像插入到生成的 PDF 中。

2. 使用 Highcharts 导出服务生成可插入 PDF 的图像（SVG 或其他格式）。代码如下：

   var chart = $('.mychart').highcharts();
   var opts = chart.options;        // retrieving current options of the chart
   opts = $.extend(true, {}, opts); // making a copy of the options for further modification
   delete opts.chart.renderTo;      // removing the possible circular reference
   
   /* Here we can modify the options to make the printed chart appear */
   /* different from the screen one                                   */
   
   var strOpts = JSON.stringify(opts);
   
   $.post(
       'http://export.highcharts.com/',
       {
           content: 'options',
           options: strOpts ,
           type:    'image/svg+xml',
           width:   '1000px',
           scale:   '1',
           constr:  'Chart',
           async:   true
       },
       function(data){
           var imgUrl = 'http://export.highcharts.com/' + data;
           /* Here you can send the image url to your server  */
           /* to make a PDF of it.                            */
           /* The url should be valid for at least 30 seconds */
       }
   );
   

   您可以在http://export.highcharts.com/上尝试不同的看涨期权。另见http://www.highcharts.com/docs/export-module/export-module-overview

请注意，mPDF 不支持某些 SVG 属性，因此您可以考虑将图表导出为光栅图像。