2

我有一组数据,我使用 HighCharts 将其表示为饼图。

我试图将图例中的标签分成两个不同的组,并给它们标题。仅出于图例显示目的,图表本身没有变化。

我尝试使用labelFormatter插入组标题,但没有成功。我还尝试了linkedTo似乎没有做我想做的事情的属性。

我有一个在图表加载时运行的函数,我可以在其中操纵图例项的位置,以在两组之间创建分离。但我无法添加标题。

有没有人在使用 HighCharts 之前遇到过这个问题并管理了一个解决方案?

这是一个小提琴,展示了我能够完成的工作(两组分离,但没有标题):http: //jsfiddle.net/EacF5/1/

这是我编写的用于在图表加载时手动操作图例的函数:

load: function(){
    var $hc_start = -1;
    $(".highcharts-legend-item").each( function(){
        var t = $(this).find("tspan").text().split( ':' );
        switch ( t[0] ){
            case 'Group 2 Title 1':
            case 'Group 2 Title 2':
                var t = $(this).attr( 'transform' ).split( ',' );
                t[1] = parseInt( t[1].replace( ')', '' ) );
                t[1] = sum(t[1])(15);
                $(this).attr( 'transform', t[0] + ',' + t[1]  + ')' );

                $hc_start = 1;
                break;
            default:
        }
    });
}

请让我知道我可以向您提供哪些进一步的信息:) 谢谢!

4

1 回答 1

3

您可以将 useHTML 设置为 true,然后添加元素或使用带有 css 样式的 labelformater。非常简单的代码;

http://jsfiddle.net/EacF5/2/

labelFormatter: function () {

            if (this.x == 0) return '<h2>Title Group 1</h2>' + this.name;
            else if (this.x == 2) return '<div class="second"><h2>Title Group 2</h2>' + this.name + '</div>';
            else return this.name;

        },
于 2013-05-21T13:49:19.957 回答