我想每秒从 SQL Server 检索新数据并将其显示在图表上。我每次都可以在 Java 脚本上刷新图表,例如
<script>
window.setInterval(function(){
// refresh chart ...
}, 20000);
但是data1、data2没有更新通过。我在数据库中插入了一些新行
这是jsp文件的整体内容
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ page import="java.sql.ResultSet" %>
<%@ page import="java.sql.SQLException" %>
<%@ page import="java.sql.Statement" %>
<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.DriverManager" %>
<%@ page import="java.util.List" %>
<%@ page import="java.util.Map" %>
<%@ page import="java.util.HashMap" %>
<%@ page import="java.util.Set" %>
<%@ page import="java.util.List" %>
<%@ page import="java.util.ArrayList" %>
<%@ page import="com.google.gson.Gson"%>
<%@ page import="com.google.gson.JsonParser"%>
<%@ page import="com.google.gson.JsonObject"%>
<%@ page import="com.google.gson.JsonElement"%>
<%@ page import="com.google.gson.JsonObject"%>
<%
Gson gsonObj = new Gson();
Map<Object,Object> map = null;
List<String>data1=new ArrayList<String>();
List<String>data2=new ArrayList<String>();
List<Map<Object,Object>> list = new ArrayList<Map<Object,Object>>();
String dataPoints = null;
Connection connect = null;
Statement s = null;
String BuildIP ="X.X.X.X";
String TCP="XXXX";
String Instancename="ABC";
String Db="DATA";
String UID="sa";
String PSW="123456";
String connectionUrl = "jdbc:sqlserver://"+BuildIP+":"+TCP+";instance="+Instancename+";databaseName="+Db+";user="+UID+";password="+PSW+"";
try {
Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver");
connect = DriverManager.getConnection(connectionUrl);
s = connect.createStatement();
String sql = "select top 10 * from TIMEDATA1 order by RecordID desc";
ResultSet resultSet = s.executeQuery(sql);
String xVal, yVal;
while( resultSet.next()) {
xVal = resultSet.getString(1);
yVal = resultSet.getString(2);
map = new HashMap<Object,Object>(); map.put("x", Double.parseDouble(xVal)); map.put("y", Double.parseDouble(yVal)); list.add(map);
dataPoints = gsonObj.toJson(list);
data1.add(xVal);
data2.add(yVal);
}
} catch (Exception e) {
// TODO Auto-generated catch block
out.println(e.getMessage());
e.printStackTrace();
}
try {
if(s!=null){
s.close();
connect.close();
}
} catch (SQLException e) {
e.printStackTrace();
out.println("<div style='width: 50%; margin-left: auto; margin-right: auto; margin-top: 200px;'>Could not connect to the database. Please check if you have SQL Connector installed on the machine - if not, try installing the same.</div>");
dataPoints = null;
}
%>
<!DOCTYPE html>
<html>
<head>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.js">
</script>
</head>
<body>
<canvas id="myChart" width="900" height="400"></canvas>
<script type="text/javascript">
window.setInterval(function(){
var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
type: 'bar',
data: {
//labels: ["CS", "IT" , "ECE" , "EE", "ME", "BE"],
labels:<%out.print(data1);%>,
datasets: [
{ label: '# of students',
data:<%out.print(data2);%>,
// data: [105,124,78,91,62,56],
backgroundColor :['rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255,99,132,1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth : 1
}
]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
}, 1000);
</script>
</body>
</html>
请帮助我如何每秒从 SQL Server 获取新数据
请您参考如下方法:
您正在使用旧的架构模型(模型1),我认为它至少有20年了!
如果你想在未来10年向前跳跃,你可以使用不同的模型:模型2。你可以在任何地方阅读更多内容,例如here或there 。
使用模型 2,您可以实现异步调用的 Web 服务(通过 ajax),轮询数据并仅更新页面的单个部分。
如果你想在未来20年向前迈进,你可以使用WebSockets
编辑:
使用 datasource and a connection pool :通过 DriverManager 打开的连接是从独立应用程序中使用的(并非总是如此)