我想更改Highcharts图例的大小(尤其是宽度)。以下是我根据我所做的研究尝试使用的一些代码:
$(window).resize(changeSummaryLayout);
function changeSummaryLayout() {
var w = window.innerWidth;
if (w < 1370 && w > 992) {
for (i = 0; i < charts.length; i++) {
charts[i].highcharts().setTitle({ x: -5 });
charts[i].highcharts().legend.options.y = 150;
charts[i].highcharts().margin[3] = 0;
charts[i].highcharts().legend.options.width = 200;
charts[i].highcharts().legend.itemStyle.width = 200;
for (var index in charts[i].highcharts().series) {
charts[i].highcharts().legend.destroyItem(charts[i].highcharts().series[index]);
}
charts[i].highcharts().legend.render();
//charts[i].highcharts().legend.update({ itemStyle150 });
//charts[i].highcharts().isDirtyLegend = true;
//charts[i].highcharts().redraw();
//charts[i].highcharts().isDirtyBox = true;
}
$('#chartContainer').css('height', '400px');
$('.pieChartTotal').css('height', '390px');
$('.pieChartCanvasSum').css('height', '330px !important');
$('.highcharts-container').children().css('height', '330px');
$('.highcharts-background').attr('height', '330px');
}
这些解决方案都没有改变宽度的工作,奇怪的是,只有在我将鼠标悬停在图例之后才会更新宽度。任何人都可以向我解释为什么会发生这种情况?
有没有可以在这里使用的解决方案?
答案 0 :(得分:0)
我认为你可以尝试:
var chart = new Highcharts.Chart({
......
});
function resizeWindow(){
chart.legend.options.width = widthyouwanttoadd;
chart.legend.itemStyle.width = widthyouwanttoadd;
for(var index in this.chart.series) {
chart.legend.destroyItem(chart.series[index]);
}
chart.legend.render()
}