将高清图中的html表格导出为pdf格式，但其显示没有html设计

Question

在Highchart title和Subtitle中都以表格形式显示但是 当我尝试将高清图中的html表导出为pdf格式但其显示时没有html设计

<script type="text/javascript">
            createGraph({
             chart: {
                renderTo: 'container',
                defaultSeriesType: 'line',
                margin: [140, 150, 60, 80],
                events: {}
            },
             credits: {
                        enabled: false // remove highcharts.com
              },
            colors: ['#009999', '#0000FF', '#6600CC','#006600','#CC0000'],
            title: {
                 align: 'left',
                style: {
                        color: '#6600CC',
                        fontWeight: 'bold',
                        fontSize: '14px'
                },
                text:'<table style="color: #0000FF">'+
                         '<tr><td>'+<%= Parameter%> +'</td></tr>'+
                         '<tr><td>'+<%= PCode%> +'</td></tr>'+
                         '<tr><td>'+<%= PName%> +'</td></tr>'+
                         '</table>',
                useHTML: true
            },
            subtitle: {
                align: 'left',
                style: {
                        color: '#6600CC',
                        fontWeight: 'bold',
                        fontSize: '14px'
                },
                text:'<table class="TFtableCol2">'+
                         '<tr><td>'+<%= HMean%> +'</td>' +
                              '<td>'+<%= HSTD%> +'</td>' +
                              '<td>'+<%= HRSD%> +'</td>' +
                              '<td>'+<%= HUCL%> +'</td>' +
                              '<td>'+<%= HLCL%> +'</td>' +
                         '</tr>'+
                           '<tr><td>'+<%= SDose%> +'</td>' +
                             '<td>'+'Spec Type :'+<%= SpecType%> +'</td>'+
                              '<td>'+<%= SPValue%> +'</td>'+
                              '<td>'+<%= SHLimit%> +'</td>'+
                              '<td>'+<%= SLLimit%> +'</td>'+
                         '</tr>'+
                      '</table>',
                useHTML: true
            },
            xAxis: {
                categories: <%= LotNumber%> , 
                title: {
                    text: 'Lot #'
                }
            },
            yAxis: {
                title: {
                    text: 'Concentration ('+<%= Unit%>+')'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            tooltip: {
                formatter: function () {
                    return '<b>' + this.series.name + '</b><br/>' + this.x + ': ' + this.y +' '+ <%= Unit%>;
                }
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'top',
                x: 0,
                y: 100
            },
            series:[{
                        name: 'Spec '+ <%= SpecType%> ,
                        data: <%= SpecValue%>  
                    },
                    {
                        name: 'Series',
                        data: <%= Series%>  
                    }, 
                     {
                        name: 'Mean',
                        data: <%= Mean%>  
                    }, 
                     {
                        name: 'UCL',
                        data: <%= UCL%>  
                    }, 
                    {
                        name: 'LCL',
                        data: <%= LCL%>  
                    }]
        });
        function createGraph(chartOptions) {
            // open the basic chart
            $(document).ready(function () {
                // set the click event for the parent chart
                chartOptions.chart.events.click = function () {
                    hs.htmlExpand(document.getElementById(chartOptions.chart.renderTo), {
                        width: 9999,
                        height: 9999,
                        allowWidthReduction: true,
                        preserveContent: false
                    }, {
                        chartOptions: chartOptions
                    });
                };
                var chart = new Highcharts.Chart(chartOptions);
            });
        }

        // Create a new chart on Highslide popup open
        hs.Expander.prototype.onAfterExpand = function () {
            if (this.custom.chartOptions) {
                var chartOptions = this.custom.chartOptions;
                if (!this.hasChart) {
                    chartOptions.chart.renderTo = $('.highslide-body')[0];
                    chartOptions.chart.events.click = function () {};
                    var hsChart = new Highcharts.Chart(chartOptions);
                }
                this.hasChart = true;
            }
        };
</script>

图表显示如下

但是像这样的

我该如何解决我的问题？

请帮助

谢谢