0
에 인쇄하는 동안 페이지 위에 윗 차트를 배포하십시오. 상위 차트가 처음입니다. 여기에 기본적으로 두 개의 차트가IE9
내 코드입니다. 브라우저에서 인쇄 명령을 내릴 때 첫 번째 차트를 인쇄 한 다음 즉시 두 번째 차트를 따라야합니다 (예 : 첫 번째 차트를 인쇄 한 후에 남은 공간이 있으면 비워두면 안됩니다). 그 공간에 나타나고 두 번째 차트가 그 공간에 완전히 수용 될 수 없다면 그 나머지 부분은 다음 페이지로 가야합니다).
이제 Chrome에서 정상적으로 작동합니다. 그러나 IE9는 다른 행동을 보여줍니다. IE9에서 어떻게 작동시킬 수 있습니까?
다음은
$(document).ready(function() {
$(function() {
$('#container').highcharts({
chart: {
type: 'bar'
},
title: {
text: 'Fruit Consumption 1'
},
xAxis: {
categories: ['Apples', 'Bananas', 'Oranges']
},
yAxis: {
title: {
text: 'Fruit eaten'
}
},
series: [{
name: 'A',
data: [1, 0, 4]
}, {
name: 'B',
data: [5, 7, 3]
},
{
name: 'C',
data: [3, 0, 3]
},
{
name: 'D',
data: [2, 1, 2]
},
{
name: 'E',
data: [4, 5, 1]
},
{
name: 'F',
data: [6, 1, 3]
},
{
name: 'G',
data: [2, 6, 5]
},
{
name: 'H',
data: [7, 2, 3]
},
{
name: 'I',
data: [1, 0, 4]
},
{
name: 'J',
data: [7, 6, 6]
},
{
name: 'K',
data: [1, 8, 5]
},
{
name: 'L',
data: [7, 2, 1]
}]
});
$('#container2').highcharts({
chart: {
type: 'bar'
},
title: {
text: 'Fruit Consumption 2'
},
xAxis: {
categories: ['Apples', 'Bananas', 'Oranges', 'Mangoes', 'Grapes', 'Guava', 'Jackfruit','Papaya']
},
yAxis: {
title: {
text: 'Fruit eaten'
}
},
series: [{
name: 'A',
data: [1, 0, 4, 4, 6, 2, 7, 3]
}, {
name: 'B',
data: [1, 0, 3, 7, 1, 1, 5, 1]
},
{
name: 'C',
data: [1, 3, 3, 7, 1, 5, 5, 1]
},
{
name: 'D',
data: [1, 4, 3, 7, 7, 1, 5, 1]
},
{
name: 'E',
data: [1, 1, 3, 3, 6, 1, 5, 1]
}]
});
});
});
및 HTML
<body>
<form id="form1" runat="server">
<div id="container" style="width:900px; height:900px" >
</div>
<div id="container2" style="width:900px; height: 900px " >
</div>
</form>