我正在使用一些条形图,我在图表底部添加日期/时间线时遇到问题。
我想要的是:
我可以创建条形图,但我无法让日期/时间工作..
有关我如何做的任何建议?
我通常会在条形图中显示24小时
我已查看下面的功能,但无法使其正常工作..
This is what I have now (JsFiddle)
我的Javascript代码:
$(function () {
Highcharts.setOptions({
global: {
useUTC: true
}
});
$('#chart1').highcharts({
chart: {
type: 'bar',
animation: false
},
credits: { enabled: false },
exporting: { enabled: false },
title: {
text: null
},
xAxis: {
categories: [ '' ]
},
yAxis: {
min: 0,
ceiling: 86400, // one day (3600*24)
title: {text: null }
},
legend: {
enabled: false,
reversed: true
},
plotOptions: {
series: {
stacking: 'normal',
animation: false
},
bar: {
animation: false,
borderWidth:0
}
},
series: [
{ name: 'TODO'
, color: 'Yellow'
, data: [ 7200 ] }, // Two hours
{ name: 'TODO'
, color: 'Red'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Red'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Red'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Red'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Yellow'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Red'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Red'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Red'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Yellow'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Red'
, data: [ 7200 ] },
{ name: 'TODO'
, color: 'Red'
, data: [ 7200 ] },
]
});
});
HTML代码
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="chart1" style="width: 100%; height: 250px; margin: 0 auto"></div>