Я использую последнюю версию Highcharts, пытаюсь экспортировать диаграмму в png и пытаюсь увидеть, есть ли способ ограничить число строк, отображаемых в экспортированном png, используя горизонтальный макет до 2 строк, если легендыразбивка на более чем 2 строки.
Вот рабочий пример экспорта: https://jsfiddle.net/siluok3/085gzjtn/7/
Highcharts.chart('container', {
chart: {
style: {
fontFamily: '"Arial", sans-serif',
color: '#7b797a',
'z-index': 'inherit'
},
resetZoomButton: {
theme: {
fill: '#5cb85c',
stroke: '#4cae4c',
style: {
color: '#fff',
fontSize: '15px'
},
r: 3,
states: {
hover: {
fill: '#449d44',
stroke: '#398439'
}
}
}
}
},
title: {
text: 'Data labels only visible on export'
},
credits: {
enabled: false,
style: {
display: "none"
}
},
legend: {
useHTML: true,
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
y: 32,
itemStyle: {
color: '#7b797a',
fontWeight: "normal"
},
itemHoverStyle: {
color: '#7b797a'
}
},
navigation: {
buttonOptions: {
theme: {
'stroke-width': 0,
r: 0,
fill: null,
states: {
hover: {
fill: null
},
select: {
stroke: null,
fill: null
}
}
}
},
menuItemHoverStyle: {
background: '#008add'
}
},
xAxis: {
labels: {
rotation: 270
},
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'Mayfsdfdsfdsf', 'Junfdfsd', 'Julfsdfsdfds', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
series: [{
data: [6, 4, 2],
name: 'Firfdsfdsst'
}, {
data: [7, 3, 2],
name: 'Secfsdfdsdfond'
}, {
data: [9, 4, 8],
name: 'Third'
}, {
data: [1, 2, 6],
name: 'Fourth'
}, {
data: [4, 6, 4],
name: 'Fifdsfdsfdsfdsfsdfth'
}, {
data: [1, 2, 7],
name: 'Sixth'
}, {
data: [4, 2, 5],
name: 'Sevefdsfdsfdsfsdnth'
}, {
data: [8, 3, 2],
name: 'Efdsfdsfdsfdsighth'
}, {
data: [4, 5, 6],
name: 'Nifdsfdsfdsfdsfdsfnth'
}, {
data: [4, 2, 5],
name: 'Sevefdsfdsfdsfsdnth'
}, {
data: [8, 3, 2],
name: 'Efdsfdsfdsfdsighth'
}, {
data: [4, 5, 6],
name: 'Nifdsfdsfdsfdsfdsfnth'
}],
exporting: {
chartOptions: {
legend: {
title: {
text: '',
},
itemHiddenStyle: {
display: 'none',
},
layout: 'horizontal',
align: 'center',
verticalAlign: 'bottom',
itemDistance: 10,
y: 0,
itemMarginTop: 5,
itemStyle: {
fontSize: '10px',
},
symbolPadding: 2,
alignColumns: false,
},
rangeSelector: {
enabled: false
},
navigator: {
enabled: false
},
scrollbar: {
enabled: false
},
}
}
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container"></div>
Как видно, легенды разбиваются на 3-й ряд, если они больше или больше. Есть ли интуитивный способ найти обходной путь?