highcharts - ハイチャート: シリーズではなく、積み上げ棒グラフの表示カテゴリ データ

Question

次のような 2 つの JS 連想配列があります。

var distroDates = [
{
    name: 'exDate',
    data: [
        '06/25/2013',
        '12/17/2012',
        '06/20/2012',
        '12/19/2011',
        '06/21/2011',
        '12/20/2010',
        '06/21/2010',
        '12/21/2009',
        '06/22/2009',
        '12/22/2008',
        '06/23/2008',
        '12/24/2007',
        '12/21/2006',
        '12/23/2005',
        '12/23/2004',
        '12/22/2003',
        '12/23/2002'
    ]
},
{
    name: 'Record Date',
    data: [
        '06/27/2013',
        '12/19/2012',
        '06/22/2012',
        '12/21/2011',
        '06/23/2011',
        '12/22/2010',
        '06/23/2010',
        '12/23/2009',
        '06/24/2009',
        '12/24/2008',
        '06/25/2008',
        '12/27/2007',
        '12/26/2006',
        '12/28/2005',
        '12/28/2004',
        '12/24/2003',
        '12/26/2002'
    ]
},
{
    name: 'Payable Date',
    data: [
        '07/02/2013',
        '12/24/2012',
        '06/27/2012',
        '12/29/2011',
        '06/27/2011',
        '12/30/2010',
        '06/25/2010',
        '12/31/2009',
        '06/26/2009',
        '12/31/2008',
        '06/27/2008',
        '01/04/2008',
        '12/28/2006',
        '12/30/2005',
        '12/30/2004',
        '01/02/2004',
        '01/02/2003'
    ]
}
]
var distroData = [
{
    name: 'Income',
    data: [
        0.3908,
        0.4948,
        0.2311,
        0.3342,
        0.245,
        0.2213,
        0.19,
        0.1404,
        0.2014,
        0.2266,
        0.2131,
        0.2328,
        0.1288,
        0.0044,
        0.6248,
        0,
        0
    ]
},
{
    name: 'S.T. Capital Gains',
    data: [
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0
    ]
},
{
    name: 'L.T. Capital Gains',
    data: [
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0
    ]
},
{
    name: 'Return on Capital',
    data: [
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0,
        0.0202,
        0,
        0,
        0
    ]
}
]

シリーズには distroData 配列が使用されます。カテゴリには distroDates が使用されます。(通常の系列データではなく) カテゴリをツールヒントに表示し、x 軸に沿って各バーにカーソルを合わせると、ツールヒントがカテゴリ値で更新されるようにします。

次のコードは、Highcharts v2.1.4/Highstock v1.2.5 を使用してこれを実現しました (両方とも読み込まれています)。

            tooltip: {
            formatter: function() {
                var s = '<table class="tooltip distro"><tbody>';
                var chart = this.points[0].series.chart; //get the chart object
                var categories = chart.xAxis[0].categories; //get the categories array
                var index = 0;
                var distroDataPoint;
                while(this.x !== categories[index]){index++;} //compute the index of corr y value in each data arrays
                $.each(distroDates, function(i, categories) { //loop through categories array
                    s += '<tr><td>'+ categories.name +':</td><td>' + categories.data[index] + '</td></tr>'; //use index to peg categories and distro data to series
                    distroDataPoint = '<tr><td>Distribution:</td><td>$' + distroData[0].data[index] + '</td></tr>';
                });
                s += distroDataPoint + '</tbody></table>'
                return s;
            },
            shared: true
        },

ただし、Highstock 1.3.4 (Highcharts を含む) にアップグレードすると、while ステートメントによってブラウザー (FF と Chrome) がロックされました。ブラウザは、おなじみの「スクリプトが応答しません」というアラートを出しました。これは、高価なループに巻き込まれたためだと思います。

パフォーマンスが許容できるように、 while を書き換える、または置き換える方法はありますか?