2

HighCharts を使用して円グラフとして表した一連のデータがあります。

凡例のラベルを 2 つの異なるグループに分割し、それらにヘッダーを付けようとしています。凡例を表示するためだけに、チャート自体に変更はありません。

グループのタイトルを挿入するために使用しようとしましlabelFormatterたが、成功しませんでした。linkedTo私はまた、私が望むことをしていないように見えるプロパティを試しました.

グラフの読み込み時に実行する機能があり、凡例アイテムの配置を操作して、2 つのグループを分離できます。しかし、ヘッダーを追加できませんでした。

以前に HighCharts でこれに遭遇し、ソリューションを管理した人はいますか?

これは私が達成できたことを示すフィドルです(2つのグループの分離ですが、タイトルはありません): 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 に答える