Обратите внимание, что это может случиться, если вы случайно забудете закрыть свое соединение:
Connection connection;
try {
Statement statement = connection.createStatement();
ResultSet resultSet = statement.executeQuery(QUERY);
if (resultSet.next()) { /* do something */ }
catch (SQLException e) { /* handle exception */ }
finally {
if (connection != null) {
try {
connection.close(); // <-- This is important
} catch (SQLException e) {
/* handle exception */
}
}
}
Если первое подключение к базе данных может работать хорошо после запуска сервера, последующие запросы могут не совпадать, в зависимости от того, как пул соединений настроен.
график составляется до добавления данных.
переместить код рисования диаграммы в обратный вызов ajax done ...
$.ajax({
url: "read_sensors.php",
dataType: 'json'
}).done(function (data) {
$.each(data, function (index, row) {
dataArea.addRow([
row.dateandtime,
parseFloat(row.temperature),
parseFloat(row.humidity)
]);
});
var chartArea = new
google.visualization.AreaChart(document.getElementById("chart_area"));
chartArea.draw(dataArea, options);
});
также, идентификатор элемента <div>
должен совпадать с идентификатором, заданным для диаграммы ,
изменить идентификатор на "chart_area"
, здесь ...
<div id="chart_area" style="width: 550px; height: 400px; margin: 0 auto">
</div>
вам также может понадобиться переместить оператор load
в тот же раздел, что и обратный вызов .. .
google.charts.load('current', {packages: ['corechart']});
google.charts.setOnLoadCallback(drawChart);
также необходимо добавить jquery на страницу, вы можете добавить ее над библиотекой Google Chart ...
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>
Ниже приведены предлагаемые правки. ...
<html>
<head>
<title>Google Charts Tutorial</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>
</head>
<body>
<div id="chart_area" style="width: 550px; height: 400px; margin: 0 auto"></div>
<script>
function drawChart() {
var dataArea = new google.visualization.DataTable();
dataArea.addColumn('string', 'Date');
dataArea.addColumn('number', 'Temperature');
dataArea.addColumn('number', 'Humidity');
var options = {
title: 'Company Performance',
hAxis: {
title: 'Year',
titleTextStyle: {color: '#333'}
},
vAxis: {minValue: 0}
};
$.ajax({
url: "read_sensors.php",
dataType: 'json',
}).done(function (data) {
$.each(data, function(index, row) {
dataArea.addRow([
row.dateandtime,
parseFloat(row.temperature),
parseFloat(row.humidity)
]);
});
var chartArea = new google.visualization.AreaChart(document.getElementById("chart_area"));
chartArea.draw(dataArea);
});
}
google.charts.load('current', {packages: ['corechart']});
google.charts.setOnLoadCallback(drawChart);
</script>
</body>
</html>
Вы должны попробовать использовать опцию complete
вместо готового, для jQuery.ajax
:
$.ajax({
url: "read_sensors.php",
dataType: 'json',
// NOTE: callback for $.ajax.done(...) goes here
complete: function(data) {
$.each(data, function(index, row) {
dataArea.addRow([
row.dateandtime,
parseFloat(row.temperature),
parseFloat(row.humidity)
]);
});
var chartArea = new google.visualization.AreaChart(document.getElementById("chart_area"));
chartArea.draw(dataArea);
}
});
Если это не работает, вы должны проверить свой CSS (встроенный или в противном случае) для любого display: none
или, может быть, вашего JavaScript для hide
/ fadeOut
/ slideDown
. [ 1116]
Если это не работает, и вы используете jQuery 2 (или 3), вы должны использовать jQuery.when
.
Например:
$.when(function() {
// code that you need to wait for
}).done(function() {
// code that runs after code above is done
});
Удачи.