我正在尝试从页面中设置的 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}" 逐字显示。
谢谢。