Skip to content

C
cmszMonitorAnalysis
Commit cb34f901 authored by liuna's avatar liuna
Browse files
Options

2018年2月1日 --智能分析平台

--实体厅流量监测：页面性能调整
parent 8e809dce
Hide whitespace changes
Inline Side-by-side
Showing with 1392 additions and 1188 deletions
src/main/webapp/WEB-INF/views/MonitorOperation/FlowMonitor.jsp
View file @ cb34f901
......@@ -255,19 +255,6 @@
<script type="text/javascript" src="${ctx}/static/js/echarts.min.js"></script>
<script type="text/javascript">
seatsActiveness();
performanceStability();
catonUser();
seatAnalysisTop();
businessOffice();
seatsReceptionUser();
userIp();
ipBusiness();
ipTrend();
serverExample();
clientCompatibility();
httpInformation();
//格式化日期
function Format(){
this.jsjava_class="jsjava.text.Format";
......@@ -394,10 +381,122 @@
var sd=new SimpleDateFormat();
sd.applyPattern("dd");
</script>
function seatsActivenessChart(city,cityValue) {
var myChart = echarts.init(document.getElementById('seatsActiveness'));
var option = {
<script type="">
function userIp() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/userIp",
async: false,
success: function(data){
console.log("用户IP分析实时",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>'+'<td>'+t[4]+'</td>');
tbody.append(tr);
});
$('#userIpTable tbody').replaceWith(tbody);
}
});
}
function userIpMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/userIpMonth",
async: false,
success: function(data){
console.log("用户IP分析当月",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>'+'<td>'+t[4]+'</td>');
tbody.append(tr);
});
$('#userIpTable tbody').replaceWith(tbody);
}
});
}
function serverExample() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/serverExample",
async: false,
success: function(data){
console.log("服务器实例实时",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>'+'<td>'+t[4]+'</td>');
tbody.append(tr);
});
$('#serverExampleTable tbody').replaceWith(tbody);
}
});
}
function serverExampleMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/serverExampleMonth",
async: false,
success: function(data){
console.log("服务器实例当月",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>'+'<td>'+t[4]+'</td>');
tbody.append(tr);
});
$('#serverExampleTable tbody').replaceWith(tbody);
}
});
}
function clientCompatibility() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/clientCompatibility",
async: false,
success: function(data){
console.log("客户端兼容性实时",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>');
tbody.append(tr);
});
$('#browserInformationTable tbody').replaceWith(tbody);
}
});
}
function clientCompatibilityMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/clientCompatibilityMonth",
async: false,
success: function(data){
console.log("客户端兼容性当月",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>');
tbody.append(tr);
});
$('#browserInformationTable tbody').replaceWith(tbody);
}
});
}
userIp();serverExample();clientCompatibility()
</script>
<script type="">
var myChartSeatsActiveness = echarts.init(document.getElementById('seatsActiveness'));
var option1 = {
title:{
text:null,
subtext:null
......@@ -417,13 +516,13 @@
yAxis:[
{
type:'category',
data:city
data:[]
}
],
series:[
{
type:'bar',
data:cityValue,
data:[],
itemStyle: {
normal: {
color:'#7ecbf2',
......@@ -442,11 +541,58 @@
],
}
myChart.setOption(option);
}
function performanceStabilityChart(city,boxValue,percent) {
var myChart = echarts.init(document.getElementById('performanceStability'));
var option = {
myChartSeatsActiveness.setOption(option1);
function seatsActiveness() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/seatsActiveness",
async: false,
success: function(data){
console.log("地市业务量占比实时",data);
var city = new Array();
var cityValue = new Array();
for(var i=0; i<data.length; i++){
city.push(data[i][0]);
cityValue.push(data[i][1]);
}
city.reverse();
cityValue.reverse();
option1.series[0].data=cityValue;
option1.yAxis[0].data=city;
myChartSeatsActiveness.setOption(option1);
}
});
}
function seatsActivenessMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/seatsActivenessMonth",
async: false,
success: function(data){
console.log("地市业务量占比当月",data);
var city = new Array();
var cityValue = new Array();
for(var i=0; i<data.length; i++){
city.push(data[i][0]);
cityValue.push(data[i][1]);
}
city.reverse();
cityValue.reverse();
option1.series[0].data=cityValue;
option1.yAxis.data=city;
myChartSeatsActiveness.setOption(option1);
}
});
}
seatsActiveness()
</script>
<script type="">
var myChartPerformanceStability = echarts.init(document.getElementById('performanceStability'));
var option2 = {
title:{
text:null,
subtext:null
......@@ -470,7 +616,7 @@
},
yAxis: {
type: 'category',
data: city,
data: [],
boundaryGap: true,
splitArea: {
show: false
......@@ -482,7 +628,7 @@
series: [
{
type: 'boxplot',
data: boxValue,
data: [],
tooltip: {
formatter: function (param) {
return [
......@@ -498,7 +644,7 @@
{
type:'bar',
show:false,
data:percent,
data:[],
itemStyle: {
normal: {
color:'#7ecbf2',
......@@ -516,1039 +662,441 @@
}
],
}
myChart.setOption(option);
}
function catonUserChart(time,time1Account,time2Account,time3Account) {
var myChart = echarts.init(document.getElementById('catonUser'));
var option = {
title:{
text:null,
subtext:null
},
tooltip: {
trigger: 'axis',
},
grid:{
x:80,
y:40,
x2:80,
y2:40,
},
legend: {
data:['无法使用','可容忍','不满意']
},
xAxis:[
{
type: 'category',
data: time,
splitLine: {
show: false
},
axisLabel: {
show: true,
formatter: function (data,i) {
if(i%4==0){
return sdf.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
myChartPerformanceStability.setOption(option2);
function performanceStability() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/performanceStability",
async: false,
success: function(data){
console.log("地市性能稳定性实时",data);
var city = new Array();
var boxValue = [];
var percent = new Array();
for(var i=0; i<data.length; i++){
city.push(data[i][0]);
percent.push(data[i][6]);
boxValue.push([data[i][1],data[i][2],data[i][3],data[i][4],data[i][5]]);
}
city.reverse();
percent.reverse();
boxValue.reverse();
option2.yAxis.data=city;
option2.series[0].data=boxValue;
option2.series[1].data=percent;
myChartPerformanceStability.setOption(option2);
}
],
series:[
{
name:'无法使用',
type:'line',
data:time1Account,
smooth: true
});
}
performanceStability();
</script>
<script>
var myChartCatonUser = echarts.init(document.getElementById('catonUser'));
var option3 = {
title:{
text:null,
subtext:null
},
tooltip: {
trigger: 'axis',
},
grid:{
x:80,
y:40,
x2:80,
y2:40,
},
legend: {
data:['无法使用','可容忍','不满意']
},
xAxis:[
{
type: 'category',
data: [],
splitLine: {
show: false
},
{
name:'可容忍',
type:'line',
data:time2Account,
smooth: true
axisLabel: {
show: true,
formatter: function (data,i) {
if(i%4==0){
return sdf.format(new Date(data));
}
},
},
{
name:'不满意',
type:'line',
data:time3Account,
smooth: true
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
],
}
myChart.setOption(option);
}
function catonUserChartMonth(time,time1Account,time2Account,time3Account) {
var myChart = echarts.init(document.getElementById('catonUser'));
var option = {
title:{
text:null,
subtext:null
}
],
series:[
{
name:'无法使用',
type:'line',
data:[],
smooth: true
},
tooltip: {
trigger: 'axis',
{
name:'可容忍',
type:'line',
data:[],
smooth: true
},
grid:{
x:80,
y:40,
x2:80,
y2:40,
{
name:'不满意',
type:'line',
data:[],
smooth: true
}
],
};
myChartCatonUser.setOption(option3);
function performanceStabilityMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/performanceStabilityMonth",
async: false,
success: function(data){
console.log("地市性能稳定性当月",data);
var city = new Array();
var boxValue = [];
var percent = new Array();
for(var i=0; i<data.length; i++){
city.push(data[i][0]);
percent.push(data[i][6]);
boxValue.push([data[i][1],data[i][2],data[i][3],data[i][4],data[i][5]]);
}
city.reverse();
percent.reverse();
boxValue.reverse();
option2.yAxis.data=city;
option2.series[0].data=boxValue;
option2.series[1].data=percent;
myChartPerformanceStability.setOption(option2);
}
});
}
// performanceStabilityMonth()
</script>
<script>
var myChartCatonUserMonth = echarts.init(document.getElementById('catonUser'));
var option4 = {
title:{
text:null,
subtext:null
},
tooltip: {
trigger: 'axis',
},
grid:{
x:80,
y:40,
x2:80,
y2:40,
},
legend: {
data:['无法使用','可容忍','不满意']
},
xAxis:[
{
type: 'category',
data: [],
splitLine: {
show: false
},
axisLabel: {
show: true,
formatter: function (data,i) {
if(i%4==0){
return sd.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:'无法使用',
type:'line',
data:[],
smooth: true
},
legend: {
data:['无法使用','可容忍','不满意']
{
name:'可容忍',
type:'line',
data:[],
smooth: true
},
xAxis:[
{
type: 'category',
data: time,
splitLine: {
show: false
},
axisLabel: {
show: true,
formatter: function (data,i) {
if(i%4==0){
return sd.format(new Date(data));
}
},
},
{
name:'不满意',
type:'line',
data:[],
smooth: true
}
],
}
myChartCatonUserMonth.setOption(option4);
function catonUser() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/catonUser",
async: false,
success: function(data){
console.log("卡顿用户实时",data);
var time = new Array();
var time1Account = new Array();
var time2Account = new Array();
var time3Account = new Array();
for(var i=0; i<data.length; i++){
time.push(df.format(new Date(data[i][0])));
time1Account.push(data[i][1]);
time2Account.push(data[i][2]);
time3Account.push(data[i][3]);
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
option3.xAxis[0].data=time;
option3.series[0].data=time1Account;
option3.series[1].data=time2Account;
option3.series[2].data=time3Account;
myChartCatonUser.setOption(option3);
}
});
}
function catonUserMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/catonUserMonth",
async: false,
success: function(data){
console.log("卡顿用户当月",data);
var time = new Array();
var time1Account = new Array();
var time2Account = new Array();
var time3Account = new Array();
for(var i=0; i<data.length; i++){
time.push(df.format(new Date(data[i][0])));
time1Account.push(data[i][1]);
time2Account.push(data[i][2]);
time3Account.push(data[i][3]);
}
],
series:[
{
name:'无法使用',
type:'line',
data:time1Account,
smooth: true
option4.xAxis[0].data=time;
option4.series[0].data=time1Account;
option4.series[1].data=time2Account;
option4.series[2].data=time3Account;
myChartCatonUserMonth.setOption(option4);
}
});
}
catonUser()
</script>
<script>
var myChartSeatAnalysis = echarts.init(document.getElementById('seatAnalysis'));
var option5 = {
title:{
text:null,
subtext:null
},
tooltip : {
trigger: 'axis'
},
legend: {
data:['业务量','成功量','均时长']
},
xAxis : [
{
type : 'category',
splitLine:{
show:false
},
{
name:'可容忍',
type:'line',
data:time2Account,
smooth: true
data : ['坐\n席\n一','坐\n席\n二','坐\n席\n三','坐\n席\n四','坐\n席\n五','坐\n席\n六','坐\n席\n七','坐\n席\n八','坐\n席\n九','坐\n席\n十']
}
],
yAxis : [
{
type : 'value',
splitLine:{
show:false
},
{
name:'不满意',
type:'line',
data:time3Account,
smooth: true
}
],
}
myChart.setOption(option);
}
function seatAnalysisChart(account,transCnt,transAvail,transTime) {
var myChart = echarts.init(document.getElementById('seatAnalysis'));
var option = {
title:{
text:null,
subtext:null
},
tooltip : {
trigger: 'axis'
{
type : 'value',
splitLine:{
show:false
},
}
],
series : [
{
name:'业务量',
type:'bar',
data:[]
},
legend: {
data:['业务量','成功量','均时长']
{
name:'成功量',
type:'bar',
data:[]
},
xAxis : [
{
type : 'category',
splitLine:{
show:false
},
data : ['坐\n席\n一','坐\n席\n二','坐\n席\n三','坐\n席\n四','坐\n席\n五','坐\n席\n六','坐\n席\n七','坐\n席\n八','坐\n席\n九','坐\n席\n十']
{
name:'均时长',
type:'line',
yAxisIndex: 1,
data:[]
}
]
}
myChartSeatAnalysis.setOption(option5);
function seatAnalysisTop() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/seatAnalysisTop",
async: false,
success: function(data){
data.sort(function(t1,t2){return t2[1]-t1[1]})
console.log("坐席分析前top10",data);
var account = new Array();
var transCnt = new Array();
var transAvail = new Array();
var transTime = new Array();
for(var i=0; i<data.length; i++){
account.push(data[i][0]);
transCnt.push(data[i][1]);
transAvail.push(data[i][2]);
transTime.push(data[i][3]);
}
],
yAxis : [
{
type : 'value',
splitLine:{
show:false
},
},
{
type : 'value',
splitLine:{
show:false
},
option5.series[0].data=transCnt;
option5.series[1].data= transAvail;
option5.series[2].data=transTime;
myChartSeatAnalysis.setOption(option5);
}
});
}
function seatAnalysisLast() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/seatAnalysisLast",
async: false,
success: function(data){
console.log("坐席分析后top10",data);
var account = new Array();
var transCnt = new Array();
var transAvail = new Array();
var transTime = new Array();
for(var i=0; i<data.length; i++){
account.push(data[i][0]);
transCnt.push(data[i][1]);
transAvail.push(data[i][2]);
transTime.push(data[i][3]);
}
],
series : [
option5.series[0].data=transCnt;
option5.series[0].data= transAvail;
option5.series[0].data=transTime;
myChartSeatAnalysis.setOption(option5);
}
});
}
seatAnalysisTop()
</script>
{
name:'业务量',
type:'bar',
data:transCnt
<script>
var myChartBusinessOffice = echarts.init(document.getElementById('businessOffice'));
var option6 = {
title:{
text:null,
subtext:null
},
tooltip : {
trigger: 'axis'
},
grid:{
x:80,
y:20,
x2:20,
y2:20,
},
legend: {
data:['营业厅1','营业厅2','营业厅3','营业厅4','营业厅5']
},
xAxis:[
{
type: 'category',
data: [],
splitLine: {
show: false
},
{
name:'成功量',
type:'bar',
data:transAvail
axisLabel: {
show: true,
interval:0,
formatter: function (data,i) {
if(i%4==0){
return sdf.format(new Date(data));
}
},
},
{
name:'均时长',
type:'line',
yAxisIndex: 1,
data:transTime
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
]
}
myChart.setOption(option);
}
function businessOfficeChart(hallList,dataList,time){
var myChart = echarts.init(document.getElementById('businessOffice'));
var option = {
title:{
text:null,
subtext:null
}
],
series:[
{
name:'营业厅1',
type:'line',
data:[],
smooth: true
},
tooltip : {
trigger: 'axis'
{
name:'营业厅2',
type:'line',
data:[],
smooth: true
},
grid:{
x:80,
y:20,
x2:20,
y2:20,
{
name:'营业厅3',
type:'line',
data:[],
smooth: true
},
legend: {
data:['营业厅1','营业厅2','营业厅3','营业厅4','营业厅5']
{
name:'营业厅4',
type:'line',
data:[],
smooth: true
},
xAxis:[
{
type: 'category',
data: time,
splitLine: {
show: false
},
axisLabel: {
show: true,
interval:0,
formatter: function (data,i) {
if(i%4==0){
return sdf.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:'营业厅1',
type:'line',
data:dataList[0],
smooth: true
},
{
name:'营业厅2',
type:'line',
data:dataList[1],
smooth: true
},
{
name:'营业厅3',
type:'line',
data:dataList[2],
smooth: true
},
{
name:'营业厅4',
type:'line',
data:dataList[3],
smooth: true
},
{
name:'营业厅5',
type:'line',
data:dataList[4],
smooth: true
}
],
}
myChart.setOption(option);
}
function businessOfficeChartMonth(hallList,dataList,time){
var myChart = echarts.init(document.getElementById('businessOffice'));
var option = {
title:{
text:null,
subtext:null
},
tooltip : {
trigger: 'axis'
},
grid:{
x:80,
y:20,
x2:20,
y2:20,
},
legend: {
data:['营业厅1','营业厅2','营业厅3','营业厅4','营业厅5']
},
xAxis:[
{
type: 'category',
data: time,
splitLine: {
show: false
},
axisLabel: {
show: true,
interval:0,
formatter: function (data,i) {
if(i%4==0){
return sd.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:'营业厅1',
type:'line',
data:dataList[0],
smooth: true
},
{
name:'营业厅2',
type:'line',
data:dataList[1],
smooth: true
},
{
name:'营业厅3',
type:'line',
data:dataList[2],
smooth: true
},
{
name:'营业厅4',
type:'line',
data:dataList[3],
smooth: true
},
{
name:'营业厅5',
type:'line',
data:dataList[4],
smooth: true
}
],
}
myChart.setOption(option);
}
function seatsReceptionUserChart(time,time1Account,time2Account,time3Account){
var myChart = echarts.init(document.getElementById('seatsReceptionUser'));
var option = {
title:{
text:null,
subtext:null
},
tooltip: {
trigger: 'axis',
},
grid:{
x:80,
x2:20,
},
legend: {
data:['无法使用','可容忍','不满意']
},
xAxis:[
{
type: 'category',
data: time,
splitLine: {
show: false
},
axisLabel: {
show: true,
formatter: function (data,i) {
if(i%4==0){
return sdf.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:'无法使用',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:time1Account,
smooth: true
},
{
name:'可容忍',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:time2Account,
smooth: true
},
{
name:'不满意',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:time3Account,
smooth: true
}
],
}
myChart.setOption(option);
}
function seatsReceptionUserChartMonth(time,time1Account,time2Account,time3Account){
var myChart = echarts.init(document.getElementById('seatsReceptionUser'));
var option = {
title:{
text:null,
subtext:null
},
tooltip: {
trigger: 'axis',
},
grid:{
x:80,
x2:80,
},
legend: {
data:['无法使用','可容忍','不满意']
},
xAxis:[
{
type: 'category',
data: time,
splitLine: {
show: false
},
axisLabel: {
show: true,
formatter: function (data,i) {
if(i%4==0){
return sd.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:'无法使用',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:time1Account,
smooth: true
},
{
name:'可容忍',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:time2Account,
smooth: true
},
{
name:'不满意',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:time3Account,
smooth: true
}
],
}
myChart.setOption(option);
}
function ipBusinessChart(cnt1,cnt2,cnt3,cnt4,cnt5,cnt6,cnt7,cnt8,cnt9,cnt10,clientIp,cnt){
var myChart = echarts.init(document.getElementById('ipBusiness'));
var option = {
title: {
text: null,
subtext: null
},
tooltip : {
trigger: 'axis',
},
grid:{
x:100,
x2:20
},
legend: {
data:['宽带开户', '资料变更','产品变更','套餐变更','综合账单查询','充值缴费','资金变化查询','详单查询','积分查询','其他']
},
xAxis : [
{
type : 'value',
splitLine:{
show:false
},
}
],
yAxis : [
{
type : 'category',
data : clientIp,
splitLine:{
show:false
},
}
],
series : [
{
name:'宽带开户',
type:'bar',
stack: '总量',
data:cnt1
},
{
name:'资料变更',
type:'bar',
stack: '总量',
data:cnt2
},
{
name:'产品变更',
type:'bar',
stack: '总量',
data:cnt3
},
{
name:'套餐变更',
type:'bar',
stack: '总量',
data:cnt4
},
{
name:'综合账单查询',
type:'bar',
stack: '总量',
data:cnt5
},
{
name:'充值缴费',
type:'bar',
stack: '总量',
data:cnt6
},
{
name:'资金变化查询',
type:'bar',
stack: '总量',
data:cnt7
},
{
name:'详单查询',
type:'bar',
stack: '总量',
data:cnt8
},
{
name:'积分查询',
type:'bar',
stack: '总量',
data:cnt9
},
{
name:'其他',
type:'bar',
stack: '总量',
data:cnt10
}
]
}
myChart.setOption(option);
}
function httpInformationChart(serverIp,sotherCnt){
var myChart = echarts.init(document.getElementById('httpState'));
var option = {
title: {
text: null,
subtext: null
},
tooltip : {
trigger: 'axis',
},
grid:{
x2:60
},
legend: {
data:['200', '302','404','空白']
},
xAxis : [
{
type : 'category',
data : serverIp,
splitLine:{
show:false
},
}
],
yAxis : [
{
type : 'value',
splitLine:{
show:false
},
}
],
series : [
{
name:'200',
type:'bar',
stack: '总量',
data:sotherCnt
},
{
name:'302',
type:'bar',
stack: '总量',
data:sotherCnt
},
{
name:'404',
type:'bar',
stack: '总量',
data:sotherCnt
},
{
name:'空白',
type:'bar',
stack: '总量',
data:sotherCnt
},
],
}
myChart.setOption(option);
}
function ipTrendChart(time,dataList,ipList) {
var myChart = echarts.init(document.getElementById('ipTrend'));
var option = {
title:{
text:null,
subtext:null
},
tooltip : {
trigger: 'axis'
},
grid:{
x:50,
y:40,
x2:10,
y2:30,
},
legend: {
data:ipList,
},
xAxis:[
{
type: 'category',
data: time,
splitLine: {
show: false
},
axisLabel: {
show: true,
interval:0,
formatter: function (data,i) {
if(i%4==0){
return sdf.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:ipList[0],
type:'line',
data:dataList[0],
smooth: true
},
{
name:ipList[1],
type:'line',
data:dataList[1],
smooth: true
},
{
name:ipList[2],
type:'line',
data:dataList[2],
smooth: true
},
{
name:ipList[3],
type:'line',
data:dataList[3],
smooth: true
},
{
name:ipList[4],
type:'line',
data:dataList[4],
smooth: true
},
{
name:ipList[5],
type:'line',
data:dataList[5],
smooth: true
}
],
}
myChart.setOption(option);
}
function ipTrendChartMonth(time,dataList,ipList) {
var myChart = echarts.init(document.getElementById('ipTrend'));
var option = {
title:{
text:null,
subtext:null
},
tooltip : {
trigger: 'axis'
},
grid:{
x:50,
y:40,
x2:10,
y2:30,
},
legend: {
data:ipList,
},
xAxis:[
{
type: 'category',
data: time,
splitLine: {
show: false
},
axisLabel: {
show: true,
interval:0,
formatter: function (data,i) {
if(i%4==0){
return sd.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:ipList[0],
type:'line',
data:dataList[0],
smooth: true
},
{
name:ipList[1],
type:'line',
data:dataList[1],
smooth: true
},
{
name:ipList[2],
type:'line',
data:dataList[2],
smooth: true
},
{
name:ipList[3],
type:'line',
data:dataList[3],
smooth: true
},
{
name:ipList[4],
type:'line',
data:dataList[4],
smooth: true
},
{
name:ipList[5],
type:'line',
data:dataList[5],
smooth: true
}
],
}
myChart.setOption(option);
}
function seatsActiveness() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/seatsActiveness",
async: false,
success: function(data){
console.log("地市业务量占比实时",data);
var city = new Array();
var cityValue = new Array();
for(var i=0; i<data.length; i++){
city.push(data[i][0]);
cityValue.push(data[i][1]);
}
city.reverse();
cityValue.reverse();
seatsActivenessChart(city,cityValue);
}
});
}
function seatsActivenessMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/seatsActivenessMonth",
async: false,
success: function(data){
console.log("地市业务量占比当月",data);
var city = new Array();
var cityValue = new Array();
for(var i=0; i<data.length; i++){
city.push(data[i][0]);
cityValue.push(data[i][1]);
}
city.reverse();
cityValue.reverse();
seatsActivenessChart(city,cityValue);
}
});
}
function performanceStability() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/performanceStability",
async: false,
success: function(data){
console.log("地市性能稳定性实时",data);
var city = new Array();
var boxValue = [];
var percent = new Array();
for(var i=0; i<data.length; i++){
city.push(data[i][0]);
percent.push(data[i][6]);
boxValue.push([data[i][1],data[i][2],data[i][3],data[i][4],data[i][5]]);
}
city.reverse();
percent.reverse();
boxValue.reverse();
performanceStabilityChart(city,boxValue,percent);
}
});
}
function performanceStabilityMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/performanceStabilityMonth",
async: false,
success: function(data){
console.log("地市性能稳定性当月",data);
var city = new Array();
var boxValue = [];
var percent = new Array();
for(var i=0; i<data.length; i++){
city.push(data[i][0]);
percent.push(data[i][6]);
boxValue.push([data[i][1],data[i][2],data[i][3],data[i][4],data[i][5]]);
}
city.reverse();
percent.reverse();
boxValue.reverse();
performanceStabilityChart(city,boxValue,percent);
}
});
}
function catonUser() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/catonUser",
async: false,
success: function(data){
console.log("卡顿用户实时",data);
var time = new Array();
var time1Account = new Array();
var time2Account = new Array();
var time3Account = new Array();
for(var i=0; i<data.length; i++){
time.push(df.format(new Date(data[i][0])));
time1Account.push(data[i][1]);
time2Account.push(data[i][2]);
time3Account.push(data[i][3]);
}
catonUserChart(time,time1Account,time2Account,time3Account);
}
});
}
function catonUserMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/catonUserMonth",
async: false,
success: function(data){
console.log("卡顿用户当月",data);
var time = new Array();
var time1Account = new Array();
var time2Account = new Array();
var time3Account = new Array();
for(var i=0; i<data.length; i++){
time.push(df.format(new Date(data[i][0])));
time1Account.push(data[i][1]);
time2Account.push(data[i][2]);
time3Account.push(data[i][3]);
}
catonUserChartMonth(time,time1Account,time2Account,time3Account);
}
});
}
function seatAnalysisTop() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/seatAnalysisTop",
async: false,
success: function(data){
console.log("坐席分析前top10",data);
var account = new Array();
var transCnt = new Array();
var transAvail = new Array();
var transTime = new Array();
for(var i=0; i<data.length; i++){
account.push(data[i][0]);
transCnt.push(data[i][1]);
transAvail.push(data[i][2]);
transTime.push(data[i][3]);
}
seatAnalysisChart(account,transCnt,transAvail,transTime);
{
name:'营业厅5',
type:'line',
data:[],
smooth: true
}
});
}
function seatAnalysisLast() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/seatAnalysisLast",
async: false,
success: function(data){
console.log("坐席分析后top10",data);
var account = new Array();
var transCnt = new Array();
var transAvail = new Array();
var transTime = new Array();
for(var i=0; i<data.length; i++){
account.push(data[i][0]);
transCnt.push(data[i][1]);
transAvail.push(data[i][2]);
transTime.push(data[i][3]);
}
seatAnalysisChart(account,transCnt,transAvail,transTime);
}
});
],
}
function businessOffice() {
$.ajax({
......@@ -1575,10 +1123,97 @@
dataList[i].push(t1[0])
})
})
businessOfficeChart(hallList,dataList,time);
option6.xAxis[0].data=time;
option6.series[0].data=dataList[0];
option6.series[1].data=dataList[1];
option6.series[2].data=dataList[2];
option6.series[3].data=dataList[3];
option6.series[4].data=dataList[4];
myChartBusinessOffice.setOption(option6);
}
});
}
businessOffice()
</script>
<script>
var myChartBusinessOfficeMonth = echarts.init(document.getElementById('businessOffice'));
var option7 = {
title:{
text:null,
subtext:null
},
tooltip : {
trigger: 'axis'
},
grid:{
x:80,
y:20,
x2:20,
y2:20,
},
legend: {
data:['营业厅1','营业厅2','营业厅3','营业厅4','营业厅5']
},
xAxis:[
{
type: 'category',
data: [],
splitLine: {
show: false
},
axisLabel: {
show: true,
interval:0,
formatter: function (data,i) {
if(i%4==0){
return sd.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:'营业厅1',
type:'line',
data:[],
smooth: true
},
{
name:'营业厅2',
type:'line',
data:[],
smooth: true
},
{
name:'营业厅3',
type:'line',
data:[],
smooth: true
},
{
name:'营业厅4',
type:'line',
data:[],
smooth: true
},
{
name:'营业厅5',
type:'line',
data:[],
smooth: true
}
],
}
function businessOfficeMonth() {
$.ajax({
type : "GET",
......@@ -1604,10 +1239,103 @@
dataList[i].push(t1[0])
})
})
businessOfficeChartMonth(hallList,dataList,time);
option7.xAxis[0].data=time;
option7.series[0].data=dataList[0];
option7.series[1].data=dataList[1];
option7.series[2].data=dataList[2];
option7.series[3].data=dataList[3];
option7.series[4].data=dataList[4];
myChartBusinessOfficeMonth.setOption(option7);
}
});
}
</script>
<script>
var myChartSeatsReceptionUser = echarts.init(document.getElementById('seatsReceptionUser'));
var option8 = {
title:{
text:null,
subtext:null
},
tooltip: {
trigger: 'axis',
},
grid:{
x:80,
x2:20,
},
legend: {
data:['无法使用','可容忍','不满意']
},
xAxis:[
{
type: 'category',
data: [],
splitLine: {
show: false
},
axisLabel: {
show: true,
formatter: function (data,i) {
if(i%4==0){
return sdf.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:'无法使用',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:[],
smooth: true
},
{
name:'可容忍',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:[],
smooth: true
},
{
name:'不满意',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:[],
smooth: true
}
],
}
function seatsReceptionUser() {
$.ajax({
type : "GET",
......@@ -1626,10 +1354,102 @@
time2Account.push(data[i][2]);
time3Account.push(data[i][3]);
}
seatsReceptionUserChart(time,time1Account,time2Account,time3Account);
option8.xAxis[0].data=time;
option8.series[0].data=time1Account;
option8.series[1].data=time2Account;
option8.series[2].data=time3Account;
myChartSeatsReceptionUser.setOption(option8);
}
});
}
seatsReceptionUser()
</script>
<script>
var myChartSeatsReceptionUserMonth = echarts.init(document.getElementById('seatsReceptionUser'));
var option9 = {
title:{
text:null,
subtext:null
},
tooltip: {
trigger: 'axis',
},
grid:{
x:80,
x2:80,
},
legend: {
data:['无法使用','可容忍','不满意']
},
xAxis:[
{
type: 'category',
data: [],
splitLine: {
show: false
},
axisLabel: {
show: true,
formatter: function (data,i) {
if(i%4==0){
return sd.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:'无法使用',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:[],
smooth: true
},
{
name:'可容忍',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:[],
smooth: true
},
{
name:'不满意',
type:'line',
itemStyle: {
normal: {
areaStyle: {
type: 'default'
}
}
},
data:[],
smooth: true
}
],
}
function seatsReceptionUserMonth() {
$.ajax({
type : "GET",
......@@ -1648,54 +1468,123 @@
time2Account.push(data[i][2]);
time3Account.push(data[i][3]);
}
seatsReceptionUserChartMonth(time,time1Account,time2Account,time3Account);
option9.xAxis[0].data=time;
option9.series[0].data=time1Account;
option9.series[1].data=time2Account;
option9.series[2].data=time3Account;
myChartSeatsReceptionUserMonth.setOption(option9);
}
});
}
function userIp() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/userIp",
async: false,
success: function(data){
console.log("用户IP分析实时",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>'+'<td>'+t[4]+'</td>');
tbody.append(tr);
});
$('#userIpTable tbody').replaceWith(tbody);
</script>
<script>
var myChartIpBusiness = echarts.init(document.getElementById('ipBusiness'));
var option10 = {
title: {
text: null,
subtext: null
},
tooltip : {
trigger: 'axis',
},
grid:{
x:100,
x2:20
},
legend: {
data:['宽带开户', '资料变更','产品变更','套餐变更','综合账单查询','充值缴费','资金变化查询','详单查询','积分查询','其他']
},
xAxis : [
{
type : 'value',
splitLine:{
show:false
},
}
});
}
function userIpMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/userIpMonth",
async: false,
success: function(data){
console.log("用户IP分析当月",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>'+'<td>'+t[4]+'</td>');
tbody.append(tr);
});
$('#userIpTable tbody').replaceWith(tbody);
],
yAxis : [
{
type : 'category',
data : [],
splitLine:{
show:false
},
}
});
],
series : [
{
name:'宽带开户',
type:'bar',
stack: '总量',
data:[]
},
{
name:'资料变更',
type:'bar',
stack: '总量',
data:[]
},
{
name:'产品变更',
type:'bar',
stack: '总量',
data:[]
},
{
name:'套餐变更',
type:'bar',
stack: '总量',
data:[]
},
{
name:'综合账单查询',
type:'bar',
stack: '总量',
data:[]
},
{
name:'充值缴费',
type:'bar',
stack: '总量',
data:[]
},
{
name:'资金变化查询',
type:'bar',
stack: '总量',
data:[]
},
{
name:'详单查询',
type:'bar',
stack: '总量',
data:[]
},
{
name:'积分查询',
type:'bar',
stack: '总量',
data:[]
},
{
name:'其他',
type:'bar',
stack: '总量',
data:[]
}
]
}
function ipBusiness() {
function ipBusinessMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/ipBusiness",
url: "${ctx}/MonitorOperation/FlowMonitor/ipBusinessMonth",
async: false,
success: function(data){
console.log("用户IP业务实时",data);
data[i].sort(function(t1,t2){return t1[2]-t2[2]});
console.log("用户IP业务当月",data);
var cnt1 = new Array();
var cnt2 = new Array();
var cnt3 = new Array();
......@@ -1722,18 +1611,32 @@
clientIp.push(data[i][10]);
cnt.push(data[i][11]);
}
ipBusinessChart(cnt1,cnt2,cnt3,cnt4,cnt5,cnt6,cnt7,cnt8,cnt9,cnt10,clientIp,cnt);
option10.yAxis[0].data=clientIp;
option10.series[0].data=cnt1;
option10.series[1].data=cnt2;
option10.series[2].data=cnt3;
option10.series[3].data=cnt4;
option10.series[4].data=cnt5;
option10.series[5].data=cnt6;
option10.series[6].data=cnt7;
option10.series[7].data=cnt8;
option10.series[8].data=cnt9;
option10.series[9].data=cnt10;
myChartIpBusiness.setOption(option10);
}
});
}
function ipBusinessMonth() {
function ipBusiness() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/ipBusinessMonth",
url: "${ctx}/MonitorOperation/FlowMonitor/ipBusiness",
async: false,
success: function(data){
console.log("用户IP业务当月",data);
console.log("用户IP业务实时",data);
var cnt1 = new Array();
var cnt2 = new Array();
var cnt3 = new Array();
......@@ -1747,6 +1650,8 @@
var clientIp = new Array();
var cnt = new Array();
for(var i=0; i<data.length; i++){
data[i].sort(function(t1,t2){return t1[2]-t2[2]});
cnt1.push(data[i][0]);
cnt2.push(data[i][1]);
cnt3.push(data[i][2]);
......@@ -1760,10 +1665,257 @@
clientIp.push(data[i][10]);
cnt.push(data[i][11]);
}
ipBusinessChart(cnt1,cnt2,cnt3,cnt4,cnt5,cnt6,cnt7,cnt8,cnt9,cnt10,clientIp,cnt);
option10.yAxis[0].data=clientIp;
option10.series[0].data=cnt1;
option10.series[1].data=cnt2;
option10.series[2].data=cnt3;
option10.series[3].data=cnt4;
option10.series[4].data=cnt5;
option10.series[5].data=cnt6;
option10.series[6].data=cnt7;
option10.series[7].data=cnt8;
option10.series[8].data=cnt9;
option10.series[9].data=cnt10;
myChartIpBusiness.setOption(option10);
}
});
}
ipBusiness()
</script>
<script>
var myChartHttpInformation = echarts.init(document.getElementById('httpState'));
var option11 = {
title: {
text: null,
subtext: null
},
tooltip : {
trigger: 'axis',
},
grid:{
x2:60
},
legend: {
data:['200', '302','404','空白']
},
xAxis : [
{
type : 'category',
data : [],
splitLine:{
show:false
},
}
],
yAxis : [
{
type : 'value',
splitLine:{
show:false
},
}
],
series : [
{
name:'200',
type:'bar',
stack: '总量',
data:[]
},
{
name:'302',
type:'bar',
stack: '总量',
data:[]
},
{
name:'404',
type:'bar',
stack: '总量',
data:[]
},
{
name:'空白',
type:'bar',
stack: '总量',
data:[]
},
],
}
function httpInformation() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/httpInformation",
async: false,
success: function(data){
console.log("HTTP状态码实时",data);
var serverIp = [];
var twoOtwo = [];
var threeOtwo = [];
var fourOfour = [];
var space = [];
for(var i=0; i<data.length; i++){
serverIp.push(data[i][0]);
twoOtwo.push(data[i][1]);
threeOtwo.push(data[i][2]);
fourOfour.push(data[i][3]);
space.push(data[i][4]);
}
option11.xAxis[0].data=serverIp;
option11.series[0].data=twoOtwo;
option11.series[1].data=threeOtwo;
option11.series[2].data=fourOfour;
option11.series[3].data=space;
myChartHttpInformation.setOption(option11);
}
});
}
function httpInformationMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/httpInformationMonth",
async: false,
success: function(data){
console.log("HTTP状态码当月",data);
var serverIp = [];
var twoOtwo = [];
var threeOtwo = [];
var fourOfour = [];
var space = [];
for(var i=0; i<data.length; i++){
serverIp.push(data[i][0]);
twoOtwo.push(data[i][1]);
threeOtwo.push(data[i][2]);
fourOfour.push(data[i][3]);
space.push(data[i][4]);
}
option11.xAxis[0].data=serverIp;
option11.series[0].data=twoOtwo;
option11.series[1].data=threeOtwo;
option11.series[2].data=fourOfour;
option11.series[3].data=space;
myChartHttpInformation.setOption(option11);
}
});
}
httpInformation()
</script>
<script>
var myChartIpTrend = echarts.init(document.getElementById('ipTrend'));
var option12 = {
title:{
text:null,
subtext:null
},
tooltip : {
trigger: 'axis'
},
grid:{
x:50,
y:40,
x2:10,
y2:30,
},
legend: {
data:[],
},
xAxis:[
{
type: 'category',
data: [],
splitLine: {
show: false
},
axisLabel: {
show: true,
interval:0,
formatter: function (data,i) {
if(i%4==0){
return sdf.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
}
],
}
function ipTrend() {
$.ajax({
type : "GET",
......@@ -1776,6 +1928,7 @@
var time=[];
var ipList=[];
data.forEach(function(t,i){
t.sort(function(t1,t2){return t1[2]-t2[2]});
if(i===0){
t.forEach(function(t1){
time.push(df.format(new Date(t1[2])))
......@@ -1788,11 +1941,145 @@
}
dataList[i].push(t1[0])
})
})
ipTrendChart(time,dataList,ipList);
});
option12.legend.data=ipList;
option12.xAxis[0].data=time;
option12.series[0].data=dataList[0];
option12.series[0].name=ipList[0];
option12.series[1].data=dataList[1];
option12.series[1].name=ipList[1];
option12.series[2].data=dataList[2];
option12.series[2].name=ipList[2];
option12.series[3].data=dataList[3];
option12.series[3].name=ipList[3];
option12.series[4].data=dataList[4];
option12.series[4].name=ipList[4];
option12.series[5].data=dataList[5];
option12.series[5].name=ipList[5];
option12.series[6].data=dataList[6];
option12.series[6].name=ipList[6];
option12.series[7].data=dataList[7];
option12.series[7].name=ipList[7];
option12.series[8].data=dataList[8];
option12.series[8].name=ipList[8];
option12.series[9].data=dataList[9];
option12.series[9].name=ipList[9];
myChartIpTrend.setOption(option12);
}
});
}
ipTrend()
</script>
<script>
var myChartIpTrendMonth = echarts.init(document.getElementById('ipTrend'));
var option13 = {
title:{
text:null,
subtext:null
},
tooltip : {
trigger: 'axis'
},
grid:{
x:50,
y:40,
x2:10,
y2:30,
},
legend: {
data:[],
},
xAxis:[
{
type: 'category',
data: [],
splitLine: {
show: false
},
axisLabel: {
show: true,
interval:0,
formatter: function (data,i) {
if(i%4==0){
return sd.format(new Date(data));
}
},
},
}
],
yAxis:[
{
type:'value',
splitLine:{
show:false
}
}
],
series:[
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
},
{
name:[],
type:'line',
data:[],
smooth: true
}
],
}
function ipTrendMonth() {
$.ajax({
type : "GET",
......@@ -1805,6 +2092,7 @@
var time=[];
var ipList=[];
data.forEach(function(t,i){
t.sort(function(t1,t2){return t1[2]-t2[2]});
if(i===0){
t.forEach(function(t1){
time.push(df.format(new Date(t1[2])))
......@@ -1818,115 +2106,31 @@
dataList[i].push(t1[0])
})
});
ipTrendChartMonth(time,dataList,ipList);
}
});
}
function serverExample() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/serverExample",
async: false,
success: function(data){
console.log("服务器实例实时",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>'+'<td>'+t[4]+'</td>');
tbody.append(tr);
});
$('#serverExampleTable tbody').replaceWith(tbody);
}
});
}
function serverExampleMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/serverExampleMonth",
async: false,
success: function(data){
console.log("服务器实例当月",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>'+'<td>'+t[4]+'</td>');
tbody.append(tr);
});
$('#serverExampleTable tbody').replaceWith(tbody);
}
});
}
function clientCompatibility() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/clientCompatibility",
async: false,
success: function(data){
console.log("客户端兼容性实时",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>');
tbody.append(tr);
});
$('#browserInformationTable tbody').replaceWith(tbody);
}
});
}
function clientCompatibilityMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/clientCompatibilityMonth",
async: false,
success: function(data){
console.log("客户端兼容性当月",data);
var tbody=$('<tbody></tbody>');
data.forEach(function(t) {
var tr = $('<tr></tr>');
tr.append('<td>'+t[0]+'</td>'+'<td>'+t[1]+'</td>'+'<td>'+t[2]+'</td>'+'<td>'+t[3]+'</td>');
tbody.append(tr);
});
$('#browserInformationTable tbody').replaceWith(tbody);
}
});
}
function httpInformation() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/httpInformation",
async: false,
success: function(data){
console.log("HTTP状态码实时",data);
var serverIp = new Array();
var sotherCnt = new Array();
for(var i=0; i<data.length; i++){
serverIp.push(data[i][0]);
sotherCnt.push(data[i][1]);
}
httpInformationChart(serverIp,sotherCnt)
}
});
}
function httpInformationMonth() {
$.ajax({
type : "GET",
contentType : "application/json",
url: "${ctx}/MonitorOperation/FlowMonitor/httpInformationMonth",
async: false,
success: function(data){
console.log("HTTP状态码当月",data);
var serverIp = new Array();
var sotherCnt = new Array();
for(var i=0; i<data.length; i++){
serverIp.push(data[i][0]);
sotherCnt.push(data[i][1]);
}
httpInformationChart(serverIp,sotherCnt)
option13.legend.data=ipList;
option13.xAxis[0].data=time;
option13.series[0].data=dataList[0];
option13.series[0].name=ipList[0];
option13.series[1].data=dataList[1];
option13.series[1].name=ipList[1];
option13.series[2].data=dataList[2];
option13.series[2].name=ipList[2];
option13.series[3].data=dataList[3];
option13.series[3].name=ipList[3];
option13.series[4].data=dataList[4];
option13.series[4].name=ipList[4];
option13.series[5].data=dataList[5];
option13.series[5].name=ipList[5];
option12.series[6].data=dataList[6];
option12.series[6].name=ipList[6];
option12.series[7].data=dataList[7];
option12.series[7].name=ipList[7];
option12.series[8].data=dataList[8];
option12.series[8].name=ipList[8];
option12.series[9].data=dataList[9];
option12.series[9].name=ipList[9];
myChartIpTrendMonth.setOption(option13);
}
});
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment