Codeigniter上的Mpdf无法生成morris折线图

时间:2016-07-30 11:24:54

标签: codeigniter mpdf morris.js

我正在使用Mpdf和codeigniter来生成pdf文件。 除了Morris Line Chart之外,一切都很完美。 Mpdf无法生成此折线图,它显示空白区域。 我的控制器看起来像这样。

            // load library 
            $this->load->library('pdf'); 
            $pdf = $this->pdf->load();

            $html = $this->load->view('pdf_view', true);

            // render the view into HTML 
            $pdf->WriteHTML(utf8_encode($html)); 
            // write the HTML into the PDF 
            $output_pdf = '/weekly_report_' . date('Y_m_d') . '.pdf'; 
            $pdf->Output("$output_pdf", 'I'); 

在View文件中看起来像这样,我测试了这个视图文件,它正常工作但在mpdf上无法正常工作

<script>
  $(function () {
    "use strict";

    // LINE CHART
    var line = new Morris.Line({
      element: 'line-chart',
      resize: true,
      data: [

        {"daykey": "9 Jul 2014", "milk_value": 3.00},


        {"daykey": "10 Jul 2014", "milk_value": 5.20},


        {"daykey": "11 Jul 2014", "milk_value": 2.40},


        {"daykey": "12 Jul 2014", "milk_value": 8.00},


        {"daykey": "13 Jul 2014", "milk_value": 5.50},


        {"daykey": "14 Jul 2014", "milk_value": 9.00},


        {"daykey": "15 Jul 2014", "milk_value": 9.50},
           ],
      xkey: 'daykey',
      xLabels:'day',
      xLabelMargin: 10,
      xLabelAngle: 90,
      ykeys: ['milk_value'],
      labels: ['Milk Production'],
      parseTime: false,
      lineColors: ['#3c8dbc'],
      hideHover: 'auto',
      pointSize: '0',
      lineWidth: '3',
      resize: true
    });

  });
</script>

我也尝试了anychart,这个结果相同。如何使用mpdf嵌入折线图?

1 个答案:

答案 0 :(得分:0)

mPDF无法直接绘制使用Javascript生成的SVG。

您必须将图表SVG源生成为字符串并将该字符串粘贴到HTML(或将其链接为图像)。或者尝试一些生成静态位图图像的库。