将静态内容添加到highchart导出的pdf标题中

Question

我正在使用高图导出选项下载pdf，我需要在高图标题中添加一些静态内容，但我无法获得完美的解决方案， 有人请帮帮我吗？

Please click here for the reference image

我需要将上面图片的内容添加到导出的pdf标题左侧。如何制作？有什么帮助吗？

Answer 1

我更新了add-data-table官方示例以添加静态表。 这里我传递了两个数组td1和td2一个用于第一列和第二列

var td1 = ['text1', 'text2', 'text3'];
var td2 = ['text12', 'text22', 'text32'];

使用渲染创建表的代码

td1.forEach(function(name, i) {
    renderer.text(
        name,
        cellLeft + cellPadding,
        tableTop + (i + 2) * rowHeight - cellPadding
      )
      .css({
        fontWeight: 'bold'
      })
      .attr({
        align: 'left'
      })
      .add();
  });

  td2.forEach(function(point, row) {

    // Apply the cell text
    renderer.text(
        point,
        cellLeft + colWidth - cellPadding,
        tableTop + (row + 2) * rowHeight - cellPadding
      )
      .attr({
        align: 'left'
      })
      .add();
  });
};

＆＃13;

＆＃13;

var td1 = ['text1', 'text2', 'text3'];
var td2 = ['text12', 'text22', 'text32'];
/**
 * Create the data table
 */
Highcharts.drawTable = function() {

  // user options
  var tableTop = 0,
    colWidth = 100,
    tableLeft = 20,
    rowHeight = 20,
    cellPadding = 2.5,
    valueDecimals = 1,
    valueSuffix = ' °C';

  // internal variables
  var chart = this,
    series = chart.series,
    renderer = chart.renderer,
    cellLeft = tableLeft;

  // draw category labels
  td1.forEach(function(name, i) {
    renderer.text(
        name,
        cellLeft + cellPadding,
        tableTop + (i + 2) * rowHeight - cellPadding
      )
      .css({
        fontWeight: 'bold'
      })
      .attr({
        align: 'left'
      })
      .add();
  });

  td2.forEach(function(point, row) {

    // Apply the cell text
    renderer.text(
        point,
        cellLeft + colWidth - cellPadding,
        tableTop + (row + 2) * rowHeight - cellPadding
      )
      .attr({
        align: 'left'
      })
      .add();


  });


};



var chart = Highcharts.chart('container', {

  chart: {
    height: 600,
    width: 600
  },

  exporting: {
    chartOptions: {
      chart: {
        height: 600,
        marginTop: 110,
        events: {
          load: Highcharts.drawTable
        }
      },
      legend: {
        y: -220
      },
      title: {
        align: 'center',
        y: 90
      },
      credits: {
        position: {
          y: -220
        }
      }
    }
  },
  series: [{
    data: [1, 2]
  }]
});

＆＃13;

<script src="https://code.highcharts.com/highcharts.src.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/offline-exporting.js"></script>
<div id="container"></div>

＆＃13;

＆＃13;

＆＃13;

Fiddle演示