phantomjs / highchart:导出为PNG / PDF时如何处理图例溢出

时间:2016-05-20 20:10:30

标签: highcharts phantomjs

我的结果是: enter image description here

欢迎任何建议。仍然坚持这个问题。 有时,图例中有太多项目,如何处理图例溢出。一种方法是根据系列的大小设置高度和宽度(导出设置如下)。 有更好的方法吗?

ADD INDEX `search` (`parent_id` ASC, `created` ASC, `updated` DESC)
-- The second "created ASC" was removed here ---------------------^

2 个答案:

答案 0 :(得分:1)

为导出对象中的maxHeight参数设置未定义的值。

legend: {
        layout: 'vertical',
        align: 'right',
        verticalAlign: 'top',
        maxHeight: 40
    },
    exporting:{
        chartOptions:{
        legend:{
            maxHeight: undefined
        }
      }
    },

示例:

答案 1 :(得分:0)

可以使用一个简单的函数覆盖您引用的函数,该函数将返回与其第一个参数相同的值。但是,禁用这样的图例导航会使您的图例变得相当大 - 具体取决于实际数据。

示例:http://jsfiddle.net/zwL7v6by/

$(function() {
  Highcharts.Legend.prototype.handleOverflow = function(legendHeight) {
    return legendHeight;
  };

  $('#container').highcharts({
    series: [{
      type: 'pie',
      showInLegend: true,
      data: [1, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7, 2, 3, 4, 5, 6, 7]
    }]
  });
});