0

我正在尝试从页面中设置的 JS 数组填充堆积条形图。我想使用每个数组（设置为 var）分别填充系列和 x 轴类别。

这是我的数据：

    <script type="text/javascript">
    var distroDates = [
        {
            name: 'exShortDate',
            data: [
                '06/2013',
                '12/2012',
                '06/2012',
                '12/2011',
                '06/2011',
                '12/2010',
                '06/2010',
                '12/2009',
                '06/2009',
                '12/2008',
                '06/2008',
                '12/2007',
                '12/2006',
                '12/2005',
                '12/2004',
                '12/2003',
                '12/2002',
            ]
        },
        {
            name: 'exLongDate',
            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: 'Distro 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: 'Distro StCapGain',
            data: [
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
            ]
        },
        {
            name: 'Distro LtCapGain',
            data: [
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
            ]
        },
        {
            name: 'Distro ReturnOnCapital',
            data: [
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0,
                0.0202,
                0,
                0,
                0,
            ]
        }
    ]
</script>

这是我的highcharts选项：

    renderStackColumnChart: function(distroDates, distroData, chartContainer) {
    var stackColumnOptions={
        chart: {
            renderTo: chartContainer,
            type: 'column',
            width: 600
        },

        legend: {
            enabled: true,
            floating: false
        },

        plotOptions: {
            column: {
                stacking: 'normal'
            },
            series: {
                showInLegend: true
            }
        },

        series: distroData,

        tooltip: {
            backgroundColor: "#ffffff",
            enabled: true,
            formatter: false,
            headerFormat: '<h5>{point.name}</h5>',
            pointFormat: '<p>{point.y}</p>',
            valueDecimals: 2,
            valuePrefix: '$'
        },

        xAxis: {
            categories: distroDates
        },

        yAxis: {
            title: {
                text: 'Total Distribution'
            }
        }
    };
    chartContainer.chart(stackColumnOptions);
}

我希望 exShortDate 值沿 x 轴显示。相反，我似乎得到了索引，即 4、5、6 等。此外，沿 x 轴的前四个值是“[Object]”。所以它看起来像：[对象] [对象] [对象] [对象] 4、5、6、7、8、9、10、11、12、13、14、15、16。

我还想知道如何让“名称”值显示在工具提示中。现在我只得到“point.y”值；"{point.name}" 逐字显示。

谢谢。

4

1 回答 1

2

exShortDate值是distroDates数组中的第一个元素。试试下面的代码。

xAxis: {
    categories: distroDates[0].data
},
于 2013-07-31T05:54:09.693 回答