我很沮丧因为经过几个小时的尝试后我找不到解决方案： 不知怎的，我的所有系列（和x轴）都没有正确对齐。例如。具有不同（！）时间戳的两个点直接在彼此上方对齐，并且x轴上的时间戳也不匹配（图片：Pic1，Pic2。通常也是带有时间戳的点“2016- 01-01 00:00:01“甚至位于具有较早时间戳的点前面/左侧，如”2016-01-01 00:00:00“。
但错误在哪里？！ 我已经尝过例如“类别”（请参阅xaxis中的未注释）并将所有时间戳放入数组并对其进行排序（请参阅var“timestamps”），但是每个事都未对齐......
这是我的代码（带一些注释）：
<script type="text/javascript">
var zeit_von = "<?php echo $_GET['von']; ?>";
var zeit_bis = "<?php echo $_GET['bis']; ?>";
//alert(zeit_von);
$(function() {
var TEMPAussen_arr = []; // array for timestamp and temperature of series 1
var TEMPBuero_arr = []; // array for timestamp and temperature of series 2
var timestamps = []; // all timestamps of all series
$.when(
// php correctly returns a JSON filled with multiple arrays like ['2016-01-01 00:00:00', '0.00'] which are all in correct order
$.get('values_aussen.php', {von: zeit_von, bis: zeit_bis}, function(data) {
var result = JSON.parse(data);
for (var key in result) {
TEMPAussen_arr.push([key, parseFloat(result[key])]);
timestamps.push(key);
}
}),
// php correctly returns a JSON filled with multiple arrays like ['2016-01-01 00:00:00', '0.00'] which are all in correct order
$.get('values_buero.php', {von: zeit_von, bis: zeit_bis}, function(data) {
var result = JSON.parse(data);
for (var key in result) {
TEMPBuero_arr.push([key, parseFloat(result[key])]);
timestamps.push(key);
}
})
).then(function() {
// All timestamps are correctly sorted (working!)
timestamps.sort(function(x, y){
return y > x ? -1 : 1;
});
$('#chart7').highcharts({
chart : {
renderTo: 'spline',
animation: true,
width: $(this).parent().width(),
zoomType: 'xy',
backgroundColor: 'rgba(45,50,55,1.00)',
reflow: true
},
legend : {
itemStyle: {
font: '14pt Helvetica',
color: 'rgba(255,255,255,1.00)'
},
itemHoverStyle: {
color: 'rgba(221,121,121,1.00)'
},
verticalAlign: 'bottom',
align: 'center',
//x: -30
},
subtitle : {
text : '',
style: {
color: 'rgba(255,255,255,1.00)'
},
align: 'left'
},
xAxis : {
tickPositioner: function(min, max) {
return timestamps;
},
type: 'datetime',
//categories: timestamps,
title : {
text : '',
style: {
color: 'rgba(255,255,255,1.00)'
}
},
labels: {
style: {
color: 'white',
fontSize:'8pt'
}
}
},
yAxis : {
title : {
text : '',
style: {
color: 'rgba(255,255,255,1.00)'
}
},
labels : {
formatter : function() {
return this.value;
},
style: {
color: 'rgba(255,255,255,1.00)'
}
}
},
tooltip : {
enabled: true,
crosshairs : true,
shared : false,
valueSuffix : ''
},
plotOptions : {
spline : {
marker : {
radius : 2,
//lineColor : '#000000',
lineWidth : 0
}
}
},
series : [{
turboThreshold: 0,
name : 'Aussen',
data : TEMPAussen_arr,
color: '#FF6666'
},
{
turboThreshold: 0,
name : 'Büro',
data : TEMPBuero_arr,
color: '#99AAFF'
//color: '#FF0000'
}
],
credits: {
enabled: false
},
global: {
useUTC: false
}
});
});
});
</script>