我的堆积柱形图在x轴上具有不规则的日期时间。日期时间间隔可以是任何时间间隔。基本上我们的爬虫从不同的api定期插入数据,但有些情况下它会在某些日期失败。所以日期时间大多是不规则的。
看看下面的例子。
$(function () {
var chart;
$(document).ready(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
plotBorderWidth: 1,
type: "column",
},
title: {
text: ""
},
xAxis: {
type: "datetime",
tickLength: 0,
},
yAxis: {
min: 0,
title: {
text: "Keywords"
},
stackLabels: {
enabled: false,
style: {
fontWeight: "bold",
color: "gray"
}
},
opposite: false
},
legend: {
backgroundColor: "white",
borderColor: "#CCC",
borderWidth: 0,
shadow: false
},
plotOptions: {
column: {
stacking: 'normal'
},
},
series: [{
name: "Ranked on Page 3",
data: [{
y: 2,
x: 1449532800000,
pointDate: 1449532800000
}, {
y: 4,
x: 1450137600000,
pointDate: 1450137600000
}, {
y: 3,
x: 1450742400000,
pointDate: 1450742400000
}, {
y: 3,
x: 1451347200000,
pointDate: 1451347200000
}, {
y: 2,
x: 1454025600000,
pointDate: 1454025600000
}],
maxPointWidth: 100
}, {
name: "Ranked on Page 2",
data: [{
y: 1,
x: 1449532800000,
pointDate: 1449532800000
}],
maxPointWidth: 100
}, {
name: "Ranked on Page 1",
data: [{
y: 2,
x: 1454025600000,
pointDate: 1454025600000
}],
maxPointWidth: 100
}],
colors: ["#6662AC", "#57B3C8", "#F7971E"]
});
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
&#13;
使用实际数据和输出:JsFiddle
任何帮助都将不胜感激。
答案 0 :(得分:0)
这可以通过Highstock使用:
来实现xAxis.ordinal = true
检查此答案:Highcharts - Column chart with empty columns for date in x-axis