我想让条形图从特定时间(4月1日)开始
所以我在下面的示例中实现了这一点:
(jsFiddle)轴右侧的样本,但条是否会消失
代码低于
yAxis: {
type: 'datetime',
min:Date.UTC(2010, 3, 1)
},
yAxis实际上从4月1日开始,但我看不到酒吧本身。
如果我将最小值标注为以下
yAxis: {
type: 'datetime'
//min:Date.UTC(2010, 3, 1)
},
现在我可以看到栏出现了,但yAxis默认显示从1月1日开始。
有人能帮我从4月1日开始显示栏和yAxis吗?
我想我找到了你正在搜索的内容。
yAxis中有一个名为min
的选项,用于设置轴的最低值。比如:
yAxis: {
type: 'datetime',
min: Date.UTC(2010, 3, 1)
}
希望这就是你正在寻找的。骗子从熊。
让我解释一下日期时间轴是如何工作的。通常,日期时间轴基于自1970-01-01 00:00:00
以来的毫秒数。也就是说,设置y: 3600 * 1000
将渲染列从1970-01-0100:00:00到1970-01-0101:00:00。你想在4月1日开始图表,但你的数据并不能反映这一点。换句话说,你需要提供这样的信息,例如:
series: [{
name: 'UP',
color: 'lime',
data: [{
x: 1,
y: Date.UTC(2015, 5, 1, 1, 0, 0) // 2015-06-01 01:00:00
// or:
// y: 1433120400000
// is the same as above use for Date.UTC()
}]
}]
现场演示:http://jsfiddle.net/v9582phy/4/
感谢您的回复,这很有帮助。我已经扩展了你的代码,并进一步增强如下
yAxis: {
type: 'datetime',
labels: {
formatter: function () {
var x=new Date(Date.UTC(2015, 3, 1)+this.value*1000*60)
return moment(x).format('MMM/DD HH:mm:ss')
}
}
},
将系列数据作为
series: [{
data: [{
status:'studying',
color: 'lime',
x: 1,
y: 5
}, {
status:'playing guitar',
color: 'yellow',
x: 2,
y: 10
}, {
status:'exam',
color: 'red',
x: 2,
y: 23
}]
}]
我得到了堆叠的条形图,每个条形图显示了持续状态的分钟数
现场演示:http://jsfiddle.net/v9582phy/11/