4

我有一个没有高度或宽度的图表。

当我点击打印按钮时，我想获得一个更高更大的图形。我尝试了 setSize() 但由于我不知道我的图表的原始大小（因为没有），我无法像以前那样调整它的大小，我最终得到了一个巨大的图表。我还尝试在另一个 div 中创建图表的副本（通过更改 renderTo、width 和 height 属性），但没有成功。已经好几个小时了，我都很困惑。

我应该怎么做才能拉伸我的图表以便在不修改原始图表的情况下打印它？

谢谢你的帮助。

4

3 回答 3

3

对我来说效果很好，看看：http: //jsfiddle.net/Fusher/6hyfk/6/

可能您试图在错误的位置设置大小，一些代码会很有用（jsfiddle 甚至更好）。

$('#container').highcharts({
    series: [{

        data: [1, 2, 3]        
    }]
});

$("#b").click(function() {
    var chart = $('#container').highcharts();

    chart.setSize(200,500, false);
    chart.print();
    chart.setSize(600,500, false)

});
于 2013-08-29T10:50:54.550 回答
3

Pawel's Fiddle 在 IE 上不起作用，它在打印之前执行第二个 setSize。您需要为打印后发生的大小设置超时。

这很好用：http: //jsfiddle.net/6hyfk/34/

$('#container').highcharts({
    series: [{

        data: [1, 2, 3]        
    }]
});

$("#b").click(function() {
    var chart = $('#container').highcharts();

    chart.setSize(200,500, false);
    chart.print();
    setTimeout(function() {
        chart.setSize(600,500, false);
    }, 1000);

});
于 2014-09-09T15:18:44.420 回答
2

除了 Pawel 和 Arthur 的解决方案之外，您还可以使用此问题中的解决方案来恢复自动调整大小功能。

我需要处理一个非常类似的问题（尽管在我的情况下它正在打印一整页，其中恰好包含一个高图，而不是专门打印图表）

我发现了许多有用的信息，未来的开发人员可能会从中受益：

提取当前图表大小： 为了在打印后重置​​图表，您可以通过调用chart.chartHeight或chart.chartWidth（其中var chart = $('#chart-container').highcharts();）收集（并因此存储以供以后重置）图表的当前大小

设置大小后返回自动调整大小： 调用setSize()post-print 后，如果窗口发生变化，图表将不再自动调整大小。您可以通过使用此处详述的“hack”来解决此问题： 在调用 Chart.setSize() 后修改 chart.hasUserSize 是个坏主意吗？ 其中涉及设置chart.hasUserSize = false;

在打印事件之前和之后挂钩 在这个问题上处理：现代浏览器是否支持 onbeforeprint / onafterprint HTML 事件？答案是（间接地）是的，但是您必须结合使用 onbeforeprint 事件和 watchMedia eventHandler API。

希望这对某人有价值吗？

于 2015-06-23T17:16:41.627 回答