0
Я получаю странное поведение с моей диаграммой. В принципе, это динамическое обновление от mysql db от jsonp callback. это данные 5-й серии, один тип сплайна и 4 типа столбца. Прежде всего, когда я загружаю диаграмму, ничего не отображается. Во-вторых, если я выбираю диапазон с первой или последней серией данных (в частности, сегодняшние данные или первый день серии), я получаю неправильный результат с огромными значениями в yaxis и обычной ошибкой Highcharts # 15. Я проверил свой json, используя ряды данных в этом jsfiddle: http://jsfiddle.net/4knAX/2/ и все в порядке (но функция aftersetextremes отключена). Наконец, когда я выбираю диапазон часов, с выходом php с 15-минутными значениями, вместо этого получаю только суточные значения. Я регулярно проверял json с jsfiddle и php-кодом, и я не могу получить от них полезный ответ. есть мой JS код:Ошибка Highcharts # 15 с неправильной серией данных
<!DOCTYPE HTML>
<html>
<head>
<link rel="shortcut icon" href="./favicon.ico" >
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Telegestione Elektra</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="./js/exporting.js"></script>
<script type="text/javascript">
$(function() {
Highcharts.setOptions({
global: {
useUTC: false
}
});
$.getJSON('grafico_nuovo.php?callback=?', function(data) {
data = [].concat(data, [[Date.UTC(2013, 7, 14, 19, 59), null, null, null, null,null]]);
val1 = [];val2 = [];val3 = [];val4 = [];val5 = [];
$.each(data, function (key, value) {
val1.push([value[0], value[1]]);
val2.push([value[0], value[2]]);
val3.push([value[0], value[3]]);
val4.push([value[0], value[4]]);
val5.push([value[0], value[5]]);
});
$('#container').highcharts('StockChart', {
chart: {
//type: 'spline',
//zoomType: 'xy'
},
navigator: {
adaptToUpdatedData: false,
series: {
data: val1
}
},
scrollbar: {
liveRedraw: false
},
title: {
text: 'AAPL history by the minute from 1998 to 2011'
},
subtitle: {
text: 'Displaying 1.7 million data points in Highcharts Stock by async server loading'
},
rangeSelector : {
buttons: [{
type: 'day',
count: 1,
text: '1d'
}, {
type: 'week',
count: 1,
text: '1w'
},{
type: 'month',
count: 1,
text: '1m'
}, {
type: 'year',
count: 1,
text: '1y'
}, {
type: 'all',
text: 'All'
}],
inputEnabled: true, // it supports only days
selected : 1 // day
},
xAxis: { type:"datetime",
minRange: 3600 * 1000, // an hour
dateTimeLabelFormats: { minute: '%H:%M', day: '%A. %e/%m' },
labels: {
rotation: 330,
y:20,
staggerLines: 1,
},
events : {
afterSetExtremes : afterSetExtremes
},
},
yAxis: [{ // Primary yAxis
labels: {
format: '{value}°C',
style: {
color: '#89A54E'
}
},
title: {
text: 'Temperature',
style: {
color: '#89A54E'
}
}
}, { // Secondary yAxis
title: {
text: 'Consumo',
style: {
color: '#4572A7'
}
},
labels: {
format: '{value} Kw',
style: {
color: '#4572A7'
}
},
opposite: true
}],
series:[{ name:'Test',
type:'spline',
tooltip: {
shared:true,
valueSuffix: ' °C',
valueDecimals: 2
},
yAxis: 0,
data:val1
},
{ name:'kwhg',
type:'column',
yAxis: 1,
tooltip: {
shared:true,
valueSuffix: ' Kwh',
valueDecimals: 2
},
data:val2
},
{ name:'kwhc',
yAxis: 1,
type:'column',
tooltip: {
shared:true,
valueSuffix: ' Kwh',
valueDecimals: 2
},
data:val3
},
{ name:'kwhi',
yAxis: 1,
type:'column',
tooltip: {
shared:true,
valueSuffix: ' Kwh',
valueDecimals: 2
},
data:val4
},
{ name:'kwhfm',
yAxis: 1,
type:'column',
tooltip: {
shared:true,
valueSuffix: ' Kwh',
valueDecimals: 2
},
data:val5
},
]
}, function (chart) {
chart.showLoading('Loading data from server2...');
chart.series[0].setData(val1);
chart.series[1].setData([]);
chart.series[2].setData([]);
chart.series[3].setData([]);
chart.series[4].setData([]);
chart.hideLoading();
});
});
});
function afterSetExtremes(e) {
var currentExtremes = this.getExtremes(),
range = e.max - e.min,
chart = $('#container').highcharts();
chart.showLoading('Loading data from server3...');
//chart.xAxis[0].setExtremes(Date.UTC(2014, 0, 2), Date.UTC(2014, 0, 8));
$.getJSON('grafico_nuovo.php?start='+ Math.round(e.min) +
'&end='+ Math.round(e.max) +'&callback=?', function(data) {
chart.series[0].setData([]);
chart.series[1].setData([]);
chart.series[2].setData([]);
chart.series[3].setData([]);
chart.series[4].setData([]);
$.each(data, function(key,value) {
val1.push([value[0], value[1]]);
val2.push([value[0], value[2]]);
val3.push([value[0], value[3]]);
val4.push([value[0], value[4]]);
val5.push([value[0], value[5]]);
});
chart.series[0].setData(val1);
chart.series[1].setData(val2);
chart.series[2].setData(val3);
chart.series[3].setData(val4);
chart.series[4].setData(val5);
chart.hideLoading(); });
};
</script>
</head>
<body>
<div id="container" style="min-width: 210px; height: 550px; margin: 0 auto; background: url(./img/257.gif);background-repeat:no-repeat;background-position:center"></div>
</body>
</html>
и мой PHP тоже:
<?php
/**
* This file loads content from four different data tables depending on the required time range.
* The stockquotes table containts 1.7 million data points. Since we are loading OHLC data and
* MySQL has no concept of first and last in a data group, we have extracted groups by hours, days
* and months into separate tables. If we were to load a line series with average data, we wouldn't
* have to do this.
*
* @param callback {String} The name of the JSONP callback to pad the JSON within
* @param start {Integer} The starting point in JS time
* @param end {Integer} The ending point in JS time
*/
// get the parameters
$callback = $_GET['callback'];
if (!preg_match('/^[a-zA-Z0-9_]+$/', $callback)) {
die('Invalid callback name');
}
$start = $_GET['start'];
if ($start && !preg_match('/^[0-9]+$/', $start)) {
die("Invalid start parameter: $start");
}
if (!$start) $start = (time() - (365 * 24 * 60 * 60)) * 1000;
$end = $_GET['end'];
if ($end && !preg_match('/^[0-9]+$/', $end)) {
die("Invalid end parameter: $end");
}
if (!$end) $end = time() * 1000;
// connect to MySQL
$link = mysqli_connect('localhost:3306', 'root', 'elektra','telegestione');
// set UTC+1 time
mysql_query("SET time_zone = '+01:00'");
// set some utility variables
$range = $end - $start;
//$startTime = gmstrftime('%Y-%m-%d %H:%M:%S', $start/1000);
$startTime= date('Y-m-d H:i:s', strtotime(gmstrftime('%Y-%m-%d %H:%M:%S', $start/1000)));
//$endTime = gmstrftime('%Y-%m-%d %H:%M:%S', $end/1000);
$endTime= date('Y-m-d H:i:s', strtotime(gmstrftime('%Y-%m-%d %H:%M:%S', $end/1000)));
// find the right table
// two days range loads minute data
if ($range < 3 * 24 * 3600 * 1000) {
if (!$link) {
die('Could not connect: ' . mysqli_error());};
//echo "minute data2" ;
$result = mysqli_query($link," select 1000*unix_timestamp(q1.time) as time, (q1.kwg) as kwhg, (q1.kwc) as kwhc, (q1.kwi) as kwhi, (q1.kwfm) as kwhfm, (q2.test) as test from
(select dataora as time, kwg, kwc, kwi, kwfm from misure where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000') as q1
JOIN
(select dataora, (Test) as test from temperature where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000') as q2
ON q1.time=q2.dataora");
//one week range loads hourly data
} elseif ($range < 7 * 24 * 3600 * 1000) {
if (!$link) {
die('Could not connect: ' . mysqli_error());};
//echo "hourly data1" ;
$result = mysqli_query($link,"select 1000*unix_timestamp(q1.time) as time, q1.kwhg, q1.kwhc, q1.kwhi, q1.kwhfm, q2.test from (
SELECT
(t1.dt) AS time,(case
when t1.value>t2.value AND t2.value>0
then abs(t1.value - t2.value)
when t1.value>t2.value AND t2.value=0
then t2.value
else t1.value END)kwhg,
(case
when t1.value1>t2.value1 AND t2.value1>0
then abs(t1.value1 - t2.value1)
when t1.value1>t2.value1 AND t2.value1=0
then t2.value1
when t1.value1=t2.value1 AND t1.value1>0
then abs(t1.value1 - t2.value1)
else 0 END) kwhc,
(case
when t1.value2>t2.value2 AND t2.value2>0
then abs(t1.value2 - t2.value2)
when t1.value2>t2.value2 AND t2.value2=0
then t2.value2
when t1.value2=t2.value2 AND t1.value2>0
then abs(t1.value2 - t2.value2)
else 0 END)kwhi,
(case
when t1.value3>t2.value3 AND t2.value3>0
then abs(t1.value3 - t2.value3)
when t1.value3>t2.value3 AND t2.value3=0
then t2.value3
when t1.value3=t2.value3 AND t1.value3>0
then abs(t1.value3 - t2.value3)
else 0 END) kwhfm
FROM
(SELECT (dataora) dt, MAX(kwhg) value, MAX(kwhc) value1, MAX(kwhi) value2, MAX(kwhfm) value3 FROM misure where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dt),hour(dt)) t1
JOIN
(SELECT (dataora) dt, MAX(kwhg) value, MAX(kwhc) value1, MAX(kwhi) value2, MAX(kwhfm) value3 FROM misure where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dt),hour(dt)) t2
on t1.dt = t2.dt + interval 1 hour) as q1
JOIN
(select dataora, AVG(Test) as test from temperature where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dataora),hour(dataora)) as q2
ON q1.time=q2.dataora");
// one month range loads hourly data
} elseif ($range < 31 * 24 * 3600 * 1000) {
if (!$link) {
die('Could not connect: ' . mysqli_error());};
//echo "hourly data2" ;
$result = mysqli_query($link,"select 1000*unix_timestamp(q1.time) as time, q1.kwhg, q1.kwhc, q1.kwhi, q1.kwhfm, q2.test from (
SELECT
(t1.dt) AS time,(case
when t1.value>t2.value AND t2.value>0
then abs(t1.value - t2.value)
when t1.value>t2.value AND t2.value=0
then t2.value
else t1.value END)kwhg,
(case
when t1.value1>t2.value1 AND t2.value1>0
then abs(t1.value1 - t2.value1)
when t1.value1>t2.value1 AND t2.value1=0
then t2.value1
when t1.value1=t2.value1 AND t1.value1>0
then abs(t1.value1 - t2.value1)
else 0 END) kwhc,
(case
when t1.value2>t2.value2 AND t2.value2>0
then abs(t1.value2 - t2.value2)
when t1.value2>t2.value2 AND t2.value2=0
then t2.value2
when t1.value2=t2.value2 AND t1.value2>0
then abs(t1.value2 - t2.value2)
else 0 END)kwhi,
(case
when t1.value3>t2.value3 AND t2.value3>0
then abs(t1.value3 - t2.value3)
when t1.value3>t2.value3 AND t2.value3=0
then t2.value3
when t1.value3=t2.value3 AND t1.value3>0
then abs(t1.value3 - t2.value3)
else 0 END) kwhfm
FROM
(SELECT (dataora) dt, MAX(kwhg) value, MAX(kwhc) value1, MAX(kwhi) value2, MAX(kwhfm) value3 FROM misure where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dt),hour(dt)) t1
JOIN
(SELECT (dataora) dt, MAX(kwhg) value, MAX(kwhc) value1, MAX(kwhi) value2, MAX(kwhfm) value3 FROM misure where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dt),hour(dt)) t2
on t1.dt = t2.dt + interval 1 hour) as q1
JOIN
(select dataora, AVG(Test) as test from temperature where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dataora),hour(dataora)) as q2
ON q1.time=q2.dataora");
// one year range loads daily data
} elseif ($range < 15 * 31 * 24 * 3600 * 1000) {
if (!$link) {
die('Could not connect: ' . mysqli_error());};
//echo "daily data2" ;
$result = mysqli_query($link,"select 1000*unix_timestamp(q1.time) as time, q1.kwhg, q1.kwhc, q1.kwhi, q1.kwhfm, q2.test from (
SELECT
(t1.dt) AS time,(case
when t1.value>t2.value AND t2.value>0
then abs(t1.value - t2.value)
when t1.value>t2.value AND t2.value=0
then t2.value
else t1.value END)kwhg,
(case
when t1.value1>t2.value1 AND t2.value1>0
then abs(t1.value1 - t2.value1)
when t1.value1>t2.value1 AND t2.value1=0
then t2.value1
when t1.value1=t2.value1 AND t1.value1>0
then abs(t1.value1 - t2.value1)
else 0 END) kwhc,
(case
when t1.value2>t2.value2 AND t2.value2>0
then abs(t1.value2 - t2.value2)
when t1.value2>t2.value2 AND t2.value2=0
then t2.value2
when t1.value2=t2.value2 AND t1.value2>0
then abs(t1.value2 - t2.value2)
else 0 END)kwhi,
(case
when t1.value3>t2.value3 AND t2.value3>0
then abs(t1.value3 - t2.value3)
when t1.value3>t2.value3 AND t2.value3=0
then t2.value3
when t1.value3=t2.value3 AND t1.value3>0
then abs(t1.value3 - t2.value3)
else 0 END) kwhfm
FROM
(SELECT (dataora) dt, MAX(kwhg) value, MAX(kwhc) value1, MAX(kwhi) value2, MAX(kwhfm) value3 FROM misure where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dt)) t1
JOIN
(SELECT (dataora) dt, MAX(kwhg) value, MAX(kwhc) value1, MAX(kwhi) value2, MAX(kwhfm) value3 FROM misure where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dt)) t2
on t1.dt = t2.dt + interval 1 day) as q1
JOIN
(select dataora, AVG(Test) as test from temperature where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dataora)) as q2
ON q1.time=q2.dataora");
// greater range loads monthly data
} else {
if (!$link) {
die('Could not connect: ' . mysqli_error());};
//echo "monthly data2" ;
$result = mysqli_query($link,"select 1000*unix_timestamp(q1.time) as time, q1.kwhg, q1.kwhc, q1.kwhi, q1.kwhfm, q2.test from (
SELECT
(t1.dt) AS time,(case
when t1.value>t2.value AND t2.value>0
then abs(t1.value - t2.value)
when t1.value>t2.value AND t2.value=0
then t2.value
else t1.value END)kwhg,
(case
when t1.value1>t2.value1 AND t2.value1>0
then abs(t1.value1 - t2.value1)
when t1.value1>t2.value1 AND t2.value1=0
then t2.value1
when t1.value1=t2.value1 AND t1.value1>0
then abs(t1.value1 - t2.value1)
else 0 END) kwhc,
(case
when t1.value2>t2.value2 AND t2.value2>0
then abs(t1.value2 - t2.value2)
when t1.value2>t2.value2 AND t2.value2=0
then t2.value2
when t1.value2=t2.value2 AND t1.value2>0
then abs(t1.value2 - t2.value2)
else 0 END)kwhi,
(case
when t1.value3>t2.value3 AND t2.value3>0
then abs(t1.value3 - t2.value3)
when t1.value3>t2.value3 AND t2.value3=0
then t2.value3
when t1.value3=t2.value3 AND t1.value3>0
then abs(t1.value3 - t2.value3)
else 0 END) kwhfm
FROM
(SELECT (dataora) dt, MAX(kwhg) value, MAX(kwhc) value1, MAX(kwhi) value2, MAX(kwhfm) value3 FROM misure where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dt),hour(dt)) t1
JOIN
(SELECT (dataora) dt, MAX(kwhg) value, MAX(kwhc) value1, MAX(kwhi) value2, MAX(kwhfm) value3 FROM misure where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dt),hour(dt)) t2
on t1.dt = t2.dt + interval 1 month) as q1
JOIN
(select dataora, AVG(Test) as test from temperature where dataora between '$startTime 00:00:00.000' and '$endTime 00:00:00.000' GROUP BY date(dataora),hour(dataora)) as q2
ON q1.time=q2.dataora");
};
$rowst = array();
while ($row = mysqli_fetch_assoc($result)) {
extract($row);
$rowst[] = "[$time,$test,$kwhg,$kwhc,$kwhi,$kwhfm]";
}
// print it
header('Content-Type: text/javascript');
echo "/* console.log(' range = $range, start = $start, end = $end, startTime = $startTime, endTime = $endTime '); */";
echo $callback ."([\n" . join(",\n", $rowst) ."\n]);";
?>
я не могу понять, почему jsfiddle показать мне правильные диаграммы, но мой браузер не может сделать то же самое с тем же кодом. Спасибо заранее пс: это моя тестовая страница: 79.28.203.203/telegestione/grafico_nuovo.html и это диаграмма результата моего кода 
и серия колонка: 