所以,我做了一个仪表板,使用ajax,sqlconnection到sqlserver 2008和SignalR来获取实时数据。 以下是我所制作的ajax的一个示例,它是在一个javascript方法中,由按钮调用:
$.ajax({
url: '../api/values',
type: 'GET',
datatype: 'json',
success: function (data) {
var totalLabel = [];
var totalValue = [];
var totalLabel2 = [];
var totalValue2 = [];
var cityValue = [];
var cityValue2 = [];
var cityName = [];
var numIndex = [];
var barColor = "";
var cityString = "";
for (var j = 1; j < cityList.length; j++)
{
cityString = cityString + "||" + " data[i].Names==\"" + cityList[j] + "\"";
}
cityString = "data[i].Names==\"" + cityList[0] + "\""+cityString;
for (var i = 0; i < data.length; i++) {
totalLabel.push(data[i].Names);
totalValue.push(data[i].ValuesDouble);
totalLabel2.push(data[i].Names2);
totalValue2.push(data[i].ValuesDouble2);
//alert(cityString);
if (eval(cityString)) {
numIndex.push(i);
}
}
for (var k = 0; k < numIndex.length; k++) {
cityValue.push(data[numIndex[k]].ValuesDouble);
cityValue2.push(data[numIndex[k]].ValuesDouble2);
cityName.push(data[numIndex[k]].Names);
}
if (numIndex.length > 0) {
for (var h = 0; h < numIndex.length - 1; h++) {
barColor = barColor + "{y:" + cityValue2[h] + ",color:'" + setGraphColor(cityValue2[h], cityValue[h]) + "'}" + ",";
}
barColor = "[" + barColor + "{y:" + cityValue2[numIndex.length-1] + ",color:'" + setGraphColor(cityValue2[numIndex.length-1],cityValue[numIndex.length-1]) + "'}" + "]";
}
else {
barColor = "[" + barColor + "{y:" + data[numIndex[0]].ValuesDouble2 + ",color:'" + setGraphColor(data[numIndex[0]].ValuesDouble2, data[numIndex[0]].ValuesDouble) + "'}" + "]";
}
$(function () {
Highcharts.chart('container', {
chart: {
type: 'column',
backgroundColor: 'black'
},
tooltip: {
formatter: function () {
var s = '<b>' + this.x + '</b><br/><div>__________________________</div><hr>';
$.each(this.points, function () {
s += '<br/><span style="color:' + this.series.color + '">\u25CF</span><b>' + this.series.name + '</b>: ' + this.y;
});
return s;
},
shared: true
},
title: {
text: ''
},
xAxis: {
categories: cityName,
},
yAxis: {
min: 0,
tickInterval: 500,
title: {
text: ''
}
},
legend: {
verticalAlign: 'top',
reversed: false,
backgroundColor: 'lightgrey'
},
plotOptions: {
series: {
stacking: 'normal'
}
},
series: [{
name: 'Daily Schedule',
data: eval(barColor)
},
{
name: 'Actual Delivery',
data: cityValue,
color: '#33FF66'
},
{
name: '0%-69%',
//data: cityValue,
color: '#FF3366'
},
{
name: '70%-89%',
// data: cityValue,
color: '#FFCC33'
},
{
name: '90%-100%',
// data: cityValue,
color: '#003DF5'
}]
});
});
}
})
以下是我的存储库连接到SQL Server的示例:
public class LocationInfoRepository
{
public IEnumerable<LocationInfo> GetData()
{
using (var connection = new SqlConnection(ConfigurationManager.ConnectionStrings["Database"].ConnectionString))
{
connection.Close();
connection.Open();
using (SqlCommand command = new SqlCommand(@"
SELECT ... ", connection))
{
command.Notification = null;
SqlDependency dependency = new SqlDependency(command);
dependency.OnChange += new OnChangeEventHandler(dependency_OnChange);
if (connection.State == ConnectionState.Closed)
{ connection.Open(); }
using (var reader = command.ExecuteReader())
{
return reader.Cast<IDataRecord>().Select(x => new LocationInfo()
{
Names = x.GetString(2),
Values = Math.Round(x.GetDouble(3), 2).ToString("#,##0.00"),
ValuesDouble = x.GetDouble(3),
Values2 = Math.Round(x.GetDecimal(4), 2).ToString("#,##0.00"),
ValuesDouble2 = x.GetDecimal(4)
}).ToList();
}
/*
using (var reader2 = command.ExecuteReader())
{
reader2.NextResult();
return reader2.Cast<IDataRecord>().Select(x => new LocationInfo()
{
SumVol = x.GetString(0)
}).ToList();
}*/
}
}
}
private void dependency_OnChange(object sender, SqlNotificationEventArgs e)
{
MyHub.Show();
}
}
我不知道为什么每次我点击一个调用ajax的按钮时,仪表板都会滞后。它是ajax,或sqlconnection,甚至是signalR本身。请帮忙!提前谢谢。