Highcharts - 在图表调整大小时调整图例大小?

时间:2014-01-10 19:46:06

标签: highcharts

在调整图表大小时,是否有动态设置图例项的特定宽度?我在图例中有一些非常长的项目名称,所以我需要指定一个宽度来强制文本换行,但我想在图表更改宽度时更改宽度。感谢。

2 个答案:

答案 0 :(得分:2)

我找到了一个更好的解决方法:

chart.legend.options.width = newwidth;
chart.legend.itemStyle.width = newwidth;
for(var index in this.chart.series) {
        chart.legend.destroyItem(chart.series[index]);
}
chart.legend.render()

答案 1 :(得分:0)

通常情况下,这是不可能的,但你可以禁用highcharts图例,并准备你自己的div(绝对定位),其中包括所有系列和点击事件的列表。这里有简单的例子

$legend = $('#customLegend');

    $.each(chart.series[0].data, function (j, data) {

        $legend.append('<div class="item"><div class="symbol" style="background-color:'+data.color+'"></div><div class="serieName" id="">' + data.name + '</div></div>');

    });

    $('#customLegend .item').click(function(){
        var inx = $(this).index(),
            point = chart.series[0].data[inx];

        if(point.visible)
            point.setVisible(false);
        else
            point.setVisible(true);
    });        

http://jsfiddle.net/N3KAC/10/

通过捕获$(window).resize()函数和调整元素大小,不仅仅是你需要的是通过它来适应你的图表。