gfwleak/k18-ntcs-web-ntc
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
This repository has been archived on 2025-09-14. You can view files and clone it, but cannot push or open issues or pull requests.
Files
0f9b829531f75394e09c5bc78f39e80e4a1073d8
k18-ntcs-web-ntc/src/main/webapp/static/pages/scripts/echart.js

1390 lines
34 KiB
JavaScript
Raw Normal View History

流量统计首页样式更新
2018-12-20 14:32:36 +06:00
//蓝色系 colors:['#0026af', '#0032bc', '#004bbc', '#015bb1', '#2f74b5', '#4186c1', '#5597cd', '#67a7de', '#77b5dc', '#98cde7', '#b9e7f4', '#d9ffff'],
//彩色系colors:[ '#fe392e','#fe7d2e','#febb1d', '#feff1d','#51d569','#51d5d5','#0032bc','#1d7cf9' ,'#77b5dc','#b9e7f4'],
流量统计详情增加表格导出excel ,csv ，表格后增加total统计列,图片打印。
2018-12-20 21:09:48 +08:00
Highcharts.setOptions({ // Apply to all charts
chart: {
events: {
beforePrint: function () {
$(".highcharts-background").attr("fill","rgba(48,48,48,1)")
},
afterPrint: function () {
$(".highcharts-background").attr("fill","rgba(255, 255, 255, 0)")
}
}
}
});
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
//协议统计分析
function echart_1(rs) {
var data=new Array();
var drillData=new Array();
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var unit="bytes";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
$(rs).each(function(i, d) {
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var inoctetsNum=d.count;
unit=changeUnit(inoctetsNum);
inoctetsNum=changeNum(inoctetsNum);
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
// var pktNum=new Array();
// var byteLen=new Array();
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
//协议图-操作系统
data.push({
name: d.protoType,
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
y: parseFloat(inoctetsNum),
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown: d.protoType,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
/*
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
pktNum[0]="pktNum";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
pktNum[1]=parseInt(d.pktNum);
byteLen[0]="byteLen";
byteLen[1]=parseInt(d.byteLen);
drillData.push({
name: d.protoType,
id: d.protoType,
type:'pie',
innerSize: '70%',
data: [pktNum,byteLen],
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
});*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
var chart = Highcharts.chart('chart_1', {
chart: {
type: 'pie',
spacing : [40, 40 , 40, 40],
backgroundColor: 'rgba(255, 255, 255, 0)',
plotBackgroundColor:null,
plotBorderWidth:null,
plotShadow:false,
// margin:10,
},
调整流量统计导出按钮位置统一
2018-11-14 11:32:28 +08:00
navigation: {
buttonOptions: {
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
x:31,
y:-30
调整流量统计导出按钮位置统一
2018-11-14 11:32:28 +08:00
}
},
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
exporting: {
allowHTML:true,
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
filename:'Protocol-Type'+addDateName(),
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
chartOptions: {
plotOptions: {
series: {
dataLabels: {
enabled: true,
allowOverlap: true, // 允许数据标签重叠
},
},
}
调整流量统计导出按钮位置统一
2018-11-14 11:32:28 +08:00
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
buttons: exportingButton('#3b355b')
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
noData:{
style: {//设置字体颜色
color: '#fff',
},
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
//colors:['#f36f8a', '#44A9A8', '#ffff43','#25f3e6' ,'#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6'],
//colors:[ '#0032bc','#1d7cf9' ,'#77b5dc','#b9e7f4','#fe392e','#fe7d2e','#febb1d', '#feff1d','#51d569','#51d5d5'],
colors:['#fe392e','#fe7d2e','#febb1d', '#feff1d','#51d569','#51d5d5','#0032bc','#1d7cf9' ,'#77b5dc','#b9e7f4'],
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
title: {
text: null
},
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
/*tool: {
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
enabled: true,
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
// headerFormat: '<span style="font-size:10px">{point.key}- <b>{point.percentage:.1f}%</span>'+unit,
pointFormat: '{series.name} {point.y}<b>'+unit,
},*/
tooltip: {
headerFormat: '{series.name}<br>',
pointFormat: '{point.name} <br>{point.y}</b> '+unit
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
},
credits:{//是否有highcharts水印
enabled:false
},
legend:{
width:480,
x:50,
itemWidth:100,
itemDistance:2,
itemHoverStyle:{
color:'#61D2F7',
},
itemStyle:{
color: '#fff',
fontFamily:'Microsoft YaHei',
},
// navigation: {//图例分页
// activeColor: 'red',
// animation: true,
// arrowSize: 15,
// inactiveColor: '#CCC',
// style: {
// fontWeight: 'bold',
// color: '#333',
// fontSize: '12px'
// }
// }
},
plotOptions: {
pie: {
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
borderColor: "",
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
allowPointSelect: true,
cursor: 'pointer',
showInLegend: true,
dataLabels: {
enabled: false,
format: '{point.name}:</b>{point.percentage:.1f}%',
style: {
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
}
},
size: 200, //饼图的大小
states: {
hover: {
enabled: false
}
},
point: {
events: {
mouseOver: function(e) { // 鼠标滑过时动态更新标题
// 标题更新函数，API 地址：https://api.hcharts.cn/highcharts#Chart.setTitle
chart.setTitle({
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
text:e.target.name.length>10? this.percentage.toFixed(2)+"%<br><span>"+e.target.name.substring(0,10)+"...</span>":this.percentage.toFixed(2)+"%<br><span>"+(e.target.name+"").substring(0,10)+"</span>",
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
floating:true,
y:120,
style: {//设置字体颜色
color: '#fff',
fontFamily:'Microsoft YaHei'
},
});
this.slice();
},
// 鼠标移出时，收回突出显示
mouseOut: function() {
this.slice();
},
// 默认是点击突出，这里屏蔽掉
click: function() {
return false;
}
},
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
},
series: [{
type: 'pie',
innerSize: '70%',//圆环的大小
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
name: ' ',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
data: data
}],
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown:{
// series:drillData,
// drillUpButton: {
// relativeTo: 'spacingBox',
// }
// }
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
}, function(c) { // 图表初始化完毕后的会掉函数
// 环形图圆心
var centerY = c.series[0].center[1],
titleHeight = parseInt(c.title.styles.fontSize);
// 动态设置标题位置
c.setTitle({
y:centerY + titleHeight/2
});
});
}
// echart_main中心图 活跃IP统计
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
function echart_main(rs) {
修改流量统计活跃IP判断条件
2018-10-12 20:30:09 +08:00
// if(rs==null||rs.length<=0){
// rs=[{"ipAddr":"103.6.1.12","linkNum":532,"pktNum": 5,"byteLen": 6},
// {"ipAddr":"163.5.6.43","linkNum":532,"pktNum": 5,"byteLen": 7},
// {"ipAddr":"170.1.0.1","linkNum":532,"pktNum": 5,"byteLen": 8},
// {"ipAddr":"10.32.33.61","linkNum":532,"pktNum": 5,"byteLen": 9},
// {"ipAddr":"145.16.1.2","linkNum":532,"pktNum": 5,"byteLen": 10},
// {"ipAddr":"153.5.0.36","linkNum":532,"pktNum": 5,"byteLen": 11}]
// }
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
var data=new Array();
var xData=new Array();
var drillData=new Array();
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var unit="bytes";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
$(rs).each(function(i, d) {
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var inoctetsNum=d.linkNum;
unit=changeUnit(inoctetsNum);
inoctetsNum=changeNum(inoctetsNum);
/*var pktNum=new Array();
var byteLen=new Array();*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
xData.push(d.ipAddr);
//活跃IP图
data.push({
name: d.ipAddr,
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
y: parseFloat(inoctetsNum),
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown: d.ipAddr,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
/*pktNum[0]="pktNum";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
pktNum[1]=parseInt(d.pktNum);
byteLen[0]="byteLen";
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
byteLen[1]=parseInt(d.byteLen);*/
/*drillData.push({
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
name: d.ipAddr,
id: d.ipAddr,
type:'pie',
tooltip: {
enabled: true,
pointFormat: '{series.name}: {point.y}<b> ({point.percentage:.1f}%)'
},
data: [pktNum,byteLen],
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
});*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
var chart = Highcharts.chart('chart_main', {
chart: {
backgroundColor: 'rgba(255, 255, 255, 0)',
plotBackgroundColor:null,
plotBorderWidth:null,
plotShadow:false,
type: 'bar',
// marginLeft:80,
marginTop:50,
inverted: true,
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
//navigation: {
//buttonOptions: {
//y:13,
//x:-7
//}
//},
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
exporting: {
allowHTML:true,
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
filename:'Active-IP'+addDateName(),
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
chartOptions: {
plotOptions: {
series: {
dataLabels: {
enabled: true,
allowOverlap: true, // 允许数据标签重叠
},
},
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},
buttons: {
contextButton: {
symbolSize: 12,
symbolX: 11,
symbolY: 10,
symbolStroke: '#e6e6e6',
symbolFill: '#e6e6e6',
width: 21,
height: 20,
theme: {
'stroke-width': 1,
stroke: '#e6e6e6',
r: 0,
fill: '#51586f',
states: {
hover: {
fill: '#51586f'
},
select: {
fill: '#51586f'
}
}
}
}
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
}
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
noData:{
style: {//设置字体颜色
color: '#fff',
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},//
//colors:['#f36f8a', '#44A9A8', '#ffff43','#25f3e6','#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6'],
colors:['#004bbc', '#015bb1', '#2f74b5', '#4186c1', '#5597cd', '#67a7de', '#77b5dc', '#98cde7', '#b9e7f4', '#d9ffff'],
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
title: {
text: null
},
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
labels:{
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
fontFamily:'Microsoft YaHei'
},
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
xAxis: {
type:'category',
categories: xData,
title: {
text: null
},
labels:{
formatter:function(){
if(this.value.length>15){
return '<span>'+this.value.substring(0,15)+"..."+'</span>'
}else{
return this.value
}
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
},
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
fontFamily:'Microsoft YaHei'
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
}
},
yAxis: {
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
min: 0,
title: {
text: unit,
align:'high',
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
fontFamily:'Microsoft YaHei'
},
},
labels: {
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
fontFamily:'Microsoft YaHei'
},
},
lineWidth: 1
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
},
tooltip: {
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
headerFormat: '{series.name}<br>',
pointFormat: '{point.name} <br>{point.y}</b> '+unit
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
plotOptions: {
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
bar: {
borderColor: "",
dataLabels: {
enabled: true,
allowOverlap: true, // 允许数据标签重叠
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
fontFamily:'Microsoft YaHei',
textOutline:'none',
fontWeight:'normal'
}
},
showInLegend: false
}
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
},
credits:{//是否有highcharts水印
enabled:false
},
series: [{
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
name: ' ',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
colorByPoint: true,
data: data
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
}],
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown:{
// activeAxisLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei',
//
// },
// activeDataLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei'
// },
// drillUpButton:{
// relativeTo: 'spacingBox',
// },
// series:drillData
// }
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
}
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
function changeNum(inoctetsNum){
// 变化单位
var inoctetsNumK=inoctetsNum/1024;
var inoctetsNumM=inoctetsNumK/1024;
var inoctetsNumG=inoctetsNumM/1024;
修改流量统计主题显示问题，设定图单位为G保留5位小数，增加app,协议时间查询
2018-12-09 19:21:28 +08:00
// if(inoctetsNumK>1){
// inoctetsNum=inoctetsNumK;
// };
// if(inoctetsNumM>1){
// inoctetsNum=inoctetsNumM;
// };
// if(inoctetsNumG>1){
// inoctetsNum=inoctetsNumG;
// };
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
inoctetsNum=inoctetsNumG;
流量统计数值保留两位小数
2018-12-12 15:33:27 +08:00
inoctetsNum=inoctetsNum.toFixed(2)
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
return inoctetsNum;
}
function changeUnit(inoctetsNum){
// 变化单位
修改流量统计主题显示问题，设定图单位为G保留5位小数，增加app,协议时间查询
2018-12-09 19:21:28 +08:00
var unit="GB";
// var inoctetsNumK=inoctetsNum/1024;
// var inoctetsNumM=inoctetsNumK/1024;
// var inoctetsNumG=inoctetsNumM/1024;
// if(inoctetsNumK>1){
// unit="KB";
// };
// if(inoctetsNumM>1){
// unit="MB";
// };
// if(inoctetsNumG>1){
// unit="GB";
// };
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
return unit
}
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
//app应用类型统计 echart_3
function echart_3(rs) {
var data=new Array();
var xData=new Array();
var drillData=new Array();
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var unit="bytes";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
$(rs).each(function(i, d) {
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var inoctetsNum=d.count;
unit=changeUnit(inoctetsNum);
inoctetsNum=changeNum(inoctetsNum);
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
var pktNum=new Array();
var byteLen=new Array();
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
xData.push(d.appType);
data.push({
name: d.appType,
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
y: parseFloat(inoctetsNum),
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
// drilldown: d.appType,
});
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
/* pktNum[0]="pktNum";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
pktNum[1]=parseInt(d.pktNum);
byteLen[0]="byteLen";
byteLen[1]=parseInt(d.byteLen);
drillData.push({
name: d.appType,
id: d.appType,
data: [pktNum,byteLen],
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
});*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
var chart = Highcharts.chart('chart_3',{
chart: {
backgroundColor: 'rgba(255, 255, 255, 0)',
plotBackgroundColor:null,
plotBorderWidth:null,
plotShadow:false,
type: 'column',
marginTop:50,
marginBottom:60,
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
/*navigation: {
调整流量统计导出按钮位置统一
2018-11-14 11:32:28 +08:00
buttonOptions: {
y: 13,
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},*/
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
exporting: {
allowHTML:true,
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
filename:'App'+addDateName(),
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
buttons: exportingButton('#415262')
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
noData:{
style: {//设置字体颜色
color: '#fff',
},
},
labels:{
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
fontFamily:'Microsoft YaHei'
},
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
//colors:['#f36f8a', '#44A9A8', '#ffff43','#25f3e6','#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6'],
colors:['#0026af', '#0032bc', '#004bbc', '#015bb1', '#2f74b5', '#4186c1', '#5597cd', '#67a7de', '#77b5dc', '#98cde7', '#b9e7f4', '#d9ffff'],
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
title: {
text: null
},
credits:{//是否有highcharts水印
enabled:false
},
xAxis: {
categories: xData,
labels:{
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
fontFamily:'Microsoft YaHei'
},
},
title: {
text: 'App',
align:'high',
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
fontFamily:'Microsoft YaHei'
},
},
},
yAxis: {
min: 0,
title: {
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
text: unit,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
align:'high',
style: {//设置字体颜色
color: '#fff',
fontFamily:'Microsoft YaHei'
},
},
labels:{
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
enabled:true,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
fontFamily:'Microsoft YaHei'
},
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
},
tooltip: {
enabled: true,
headerFormat: '<span style="font-size:10px"><b>{point.key}</span><br>',
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
pointFormat: '{point.y:.1f} <b> '+unit,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
shared: true,
useHTML: true
},
plotOptions: {
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
column: {
新增流量统计带宽详情页面，IPv4,6,Tcp,udp为条件统计
2018-12-04 11:52:21 +08:00
dataLabels: {// 柱形图上的数字显示
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
enabled: true,
allowOverlap: true, // 允许数据标签重叠
style: {//设置字体颜色
color: '#fff',
fontSize:'10px',
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
fontFamily:'Microsoft YaHei',
textOutline:'none',
fontWeight:'normal'
}
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
borderColor: "",//去边框
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
showInLegend:false
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
},
series: [{
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
name: '',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
colorByPoint: true,
data: data
}],
/*drilldown:{
activeAxisLabelStyle:{
textDecoration:'none',
color: '#fff',
fontStyle:'Microsoft YaHei',
},
activeDataLabelStyle:{
textDecoration:'none',
color: '#fff',
fontStyle:'Microsoft YaHei'
},
drillUpButton: {
relativeTo: 'spacingBox',
},
series:drillData
}*/
});
}
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
//终端用户 分操作系统
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
function echart_2(rs){
var data=new Array();
var drillData=new Array();
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var unit="bytes";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
$(rs).each(function(i, d) {
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var inoctetsNum=d.count;
unit=changeUnit(inoctetsNum);
inoctetsNum=changeNum(inoctetsNum);
// var pktNum=new Array();
// var byteLen=new Array();
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
data.push({
name: d.osType,
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
y: parseFloat(inoctetsNum),
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown: d.osType,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
/* pktNum[0]="pktNum";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
pktNum[1]=parseInt(d.pktNum);
byteLen[0]="byteLen";
byteLen[1]=parseInt(d.byteLen);
drillData.push({
name: d.osType,
id: d.osType,
type:'pie',
data: [pktNum,byteLen],
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
});*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
// 创建图例
var chart = Highcharts.chart('chart_2',{
chart: {
backgroundColor: 'rgba(255, 255, 255, 0)',
plotBackgroundColor:null,
plotBorderWidth:null,
plotShadow:false,
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
type: 'pie',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
},
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
exporting: {
allowHTML:true,
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
filename:'BS'+addDateName(),
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
chartOptions: {
plotOptions: {
series: {
dataLabels: {
enabled: true,
allowOverlap: true, // 允许数据标签重叠
},
},
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},
buttons: exportingButton('#372f57')
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
noData:{
style: {//设置字体颜色
color: '#fff',
},
},
legend:{
width:480,
x:40,
itemWidth:100,
itemDistance:2,
itemHoverStyle:{
color:'#61D2F7',
},
itemStyle:{
color: '#fff',
fontFamily:'Microsoft YaHei',
}
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
//colors:['#f36f8a', '#44A9A8', '#ffff43','#25f3e6','#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6'],
//colors:[ '#0032bc','#1d7cf9' ,'#77b5dc','#b9e7f4','#fe392e','#fe7d2e','#febb1d', '#feff1d','#51d569','#51d5d5'],
colors:['#fe392e','#fe7d2e','#febb1d', '#feff1d','#51d569','#51d5d5','#0032bc','#1d7cf9' ,'#77b5dc','#b9e7f4'],
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
title: {
text: null,
style: {//设置字体颜色
color: '#fff',
fontSize:'18px',
fontFamily:'Microsoft YaHei'
},
},
plotOptions: {
series: {
dataLabels: {
enabled: false,
format: '{point.name}'
},
},
pie:{
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
borderColor: "",
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
showInLegend: true,
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
size: '80%',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
point: {
events: {
mouseOver: function(e) {
this.slice();
},
// 鼠标移出时，收回突出显示
mouseOut: function() {
this.slice();
},
// 默认是点击突出，这里屏蔽掉
click: function() {
return false;
}
},
},
}
},
credits:{//是否有highcharts水印
enabled:false
},
tooltip: {
enabled: true,
headerFormat: '<span style="font-size:10px">{point.key}: <b>{point.percentage:.1f}%</span><br>',
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
pointFormat: '{point.y} <b> '+unit,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
shared: true,
useHTML: true
},
series: [{
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
name: ' ',
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
size: '80%',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
colorByPoint: true,
data: data
}],
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown:{
// activeAxisLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei',
//
// },
// activeDataLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei'
// },
// series:drillData,
// drillUpButton: {
// relativeTo: 'spacingBox',
// }
// }
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
}
//当点击操作系统列表时-显示浏览器
function echart_5(rs){
var data=new Array();
var drillData=new Array();
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var unit="bytes";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
$(rs).each(function(i, d) {
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var inoctetsNum=d.count;
unit=changeUnit(inoctetsNum);
inoctetsNum=changeNum(inoctetsNum);
// var pktNum=new Array();
// var byteLen=new Array();
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
//协议图-操作系统
data.push({
name: d.bsType,
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
y: parseFloat(inoctetsNum),
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown: d.bsType,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
/* pktNum[0]="pktNum";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
pktNum[1]=parseInt(d.pktNum);
byteLen[0]="byteLen";
byteLen[1]=parseInt(d.byteLen);
drillData.push({
name: d.bsType,
id: d.bsType,
type:'pie',
data: [pktNum,byteLen],
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
});*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
// 创建图例
var chart = Highcharts.chart('chart_2',{
chart: {
backgroundColor: 'rgba(255, 255, 255, 0)',
plotBackgroundColor:null,
plotBorderWidth:null,
plotShadow:false,
type: 'pie'
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
/*navigation: {
调整流量统计导出按钮位置统一
2018-11-14 11:32:28 +08:00
buttonOptions: {
y: -8,
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},*/
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
exporting: {
allowHTML:true,
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
filename:'BS'+addDateName(),
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
chartOptions: {
plotOptions: {
series: {
dataLabels: {
enabled: true,
allowOverlap: true, // 允许数据标签重叠
},
},
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},
buttons: exportingButton('#372f57')
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
legend:{
width:480,
x:40,
itemWidth:100,
itemDistance:2,
itemHoverStyle:{
color:'#61D2F7',
},
itemStyle:{
color: '#fff',
fontFamily:'Microsoft YaHei',
}
},
noData:{
style: {//设置字体颜色
color: '#fff',
},
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
colors:['#fe392e','#fe7d2e','#febb1d', '#feff1d','#51d569','#51d5d5','#0032bc','#1d7cf9' ,'#77b5dc','#b9e7f4'],
/*colors:['#f36f8a', '#44A9A8', '#ffff43','#25f3e6','#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6'],*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
title: {
text: null,
style: {//设置字体颜色
color: '#fff',
fontSize:'18px',
fontFamily:'Microsoft YaHei'
},
},
plotOptions: {
series: {
dataLabels: {
enabled: false,
format: '{point.name}'
},
},
pie:{
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
borderColor: "",
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
point: {
events: {
mouseOver: function(e) { // 鼠标滑过时动态更新标题
this.slice();
},
// 鼠标移出时，收回突出显示
mouseOut: function() {
this.slice();
},
// 默认是点击突出，这里屏蔽掉
click: function() {
return false;
}
},
},
showInLegend: true,
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
size: '80%',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
}
},
credits:{//是否有highcharts水印
enabled:false
},
tooltip: {
enabled: true,
headerFormat: '<span style="font-size:10px">{point.key}: <b>{point.percentage:.1f}%</span><br>',
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
pointFormat: '{point.y} <b> '+unit,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
shared: true,
useHTML: true
},
series: [{
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
name: ' ',
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
size: '80%',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
colorByPoint: true,
data: data
}],
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown:{
// activeAxisLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei',
//
// },
// activeDataLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei'
// },
// series:drillData,
// drillUpButton: {
// relativeTo: 'spacingBox',
// }
// }
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
}
//网站流量分析
function echart_4(rs){
var data=new Array();
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
// var drillData=new Array();
var unit="bytes";
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
$(rs).each(function(i, d) {
var inoctetsNum=d.count;
unit=changeUnit(inoctetsNum);
inoctetsNum=changeNum(inoctetsNum);
// var pktNum=new Array();
// var byteLen=new Array();
data.push({
name: d.websiteService,
y: parseFloat(inoctetsNum),
// drilldown: d.websiteService,
});
/* pktNum[0]="pktNum";
pktNum[1]=parseInt(d.pktNum);
byteLen[0]="byteLen";
byteLen[1]=parseInt(d.byteLen);
drillData.push({
name: d.websiteService,
id: d.websiteService,
type:'pie',
data: [pktNum,byteLen],
});*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
// 创建图例
var chart = Highcharts.chart('chart_4',{
chart: {
backgroundColor: 'rgba(255, 255, 255, 0)',
plotBackgroundColor:null,
plotBorderWidth:null,
plotShadow:false,
type: 'pie'
},
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
exporting: {
allowHTML:true,
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
filename:'Website'+addDateName(),
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
chartOptions: {
plotOptions: {
series: {
dataLabels: {
enabled: true,
allowOverlap: true, // 允许数据标签重叠
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
}
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
},
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},
buttons: exportingButton('#3c2347')
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
//colors:[ '#44A9A8', '#f36f8a','#25f3e6','#ffff43','#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6'],
//colors:[ '#0032bc','#1d7cf9' ,'#77b5dc','#b9e7f4','#fe392e','#fe7d2e','#febb1d', '#feff1d','#51d569','#51d5d5'],
colors:['#fe392e','#fe7d2e','#febb1d', '#feff1d','#51d569','#51d5d5','#0032bc','#1d7cf9' ,'#77b5dc','#b9e7f4'],
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
title: {
text: null,
},
noData:{
style: {//设置字体颜色
color: '#fff',
},
},
plotOptions: {
series: {
dataLabels: {
enabled: false,
format: '{point.name}'
},
},
pie:{
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
borderColor: "",
size: "80%",
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
showInLegend: true,
point: {
events: {
mouseOver: function(e) {
this.slice();
},
// 鼠标移出时，收回突出显示
mouseOut: function() {
this.slice();
},
// 默认是点击突出，这里屏蔽掉
click: function() {
return false;
}
},
},
}
},
credits:{//是否有highcharts水印
enabled:false
},
legend:{
width:480,
x:50,
itemWidth:100,
itemDistance:2,
itemHoverStyle:{
color:'#61D2F7',
},
itemStyle:{
color: '#fff',
fontFamily:'Microsoft YaHei',
}
},
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
tooltip: {
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
enabled: true,
headerFormat: '<span style="font-size:10px">{point.key}: <b>{point.percentage:.1f}%</span><br>',
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
pointFormat: '{point.y} <b> '+unit,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
shared: true,
useHTML: true
},
series: [{
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
name: ' ',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
colorByPoint: true,
data: data,
}],
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown:{
// activeAxisLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei',
//
// },
// activeDataLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei'
// },
// series:drillData,
// drillUpButton: {
// relativeTo: 'spacingBox',
// }
// }
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
}
//网站流量分析-点击列表显示网站分类
function echart_6(rs){
var data=new Array();
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
// var drillData=new Array();
var unit="bytes";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
$(rs).each(function(i, d) {
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var inoctetsNum=d.count;
unit=changeUnit(inoctetsNum);
inoctetsNum=changeNum(inoctetsNum);
// var pktNum=new Array();
// var byteLen=new Array();
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
//协议图-操作系统
data.push({
name: d.domain,
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
y: parseFloat(inoctetsNum),
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown: d.domain,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
/* pktNum[0]="pktNum";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
pktNum[1]=parseInt(d.pktNum);
byteLen[0]="byteLen";
byteLen[1]=parseInt(d.byteLen);
drillData.push({
name: d.domain,
id: d.domain,
type:'pie',
data: [pktNum,byteLen],
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
});*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
// 创建图例
var chart = Highcharts.chart('chart_4',{
chart: {
backgroundColor: 'rgba(255, 255, 255, 0)',
plotBackgroundColor:null,
plotBorderWidth:null,
plotShadow:false,
type: 'pie'
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
/*navigation: {
调整流量统计导出按钮位置统一
2018-11-14 11:32:28 +08:00
buttonOptions: {
x:-5,
y: -10,
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},*/
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
exporting: {
allowHTML:true,
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
filename:'Website'+addDateName(),
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
chartOptions: {
plotOptions: {
series: {
dataLabels: {
enabled: true,
allowOverlap: true, // 允许数据标签重叠
},
},
}
}
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
noData:{
style: {//设置字体颜色
color: '#fff',
},
},
colors:[ '#44A9A8', '#f36f8a','#25f3e6','#ffff43','#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6'],
title: {
text: null,
},
plotOptions: {
series: {
dataLabels: {
enabled: false,
format: '{point.name}'
},
},
pie:{
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
borderColor: "",
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
showInLegend: true,
point: {
events: {
mouseOver: function(e) { // 鼠标滑过时动态更新标题
this.slice();
},
// 鼠标移出时，收回突出显示
mouseOut: function() {
this.slice();
},
// 默认是点击突出，这里屏蔽掉
click: function() {
return false;
}
},
},
}
},
credits:{//是否有highcharts水印
enabled:false
},
legend:{
width:480,
x:50,
itemWidth:100,
itemDistance:2,
itemHoverStyle:{
color:'#61D2F7',
},
itemStyle:{
color: '#fff',
fontFamily:'Microsoft YaHei',
}
},
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
tooltip: {
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
enabled: true,
headerFormat: '<span style="font-size:10px">{point.key}: <b>{point.percentage:.1f}%</span><br>',
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
pointFormat: '{point.y} <b> '+unit,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
shared: true,
useHTML: true
},
series: [{
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
name: ' ',
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
colorByPoint: true,
data: data,
}],
增加流量统计带宽统计
2018-09-26 16:27:17 +08:00
// drilldown:{
// activeAxisLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei',
//
// },
// activeDataLabelStyle:{
// textDecoration:'none',
// color: '#fff',
// fontStyle:'Microsoft YaHei'
// },
// series:drillData,
// drillUpButton: {
// relativeTo: 'spacingBox',
// }
// }
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
}
function echart_topic_domain(rs){
var data=[{
'id': '0.0',
修改流量统计主题显示问题，设定图单位为G保留5位小数，增加app,协议时间查询
2018-12-09 19:21:28 +08:00
// 'parent': '',
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
'name': 'Service'
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
}];
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var unit="bytes";
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
$(rs).each(function(i,d){
流量统计新增app应用详情，阻断监测动作趋势统计
2018-12-06 17:27:04 +08:00
var inoctetsNum=d.count;
修改流量统计列表错误提示格式，对service数据保留处理
2018-12-28 18:01:29 +08:00
var inoctetsNumK=inoctetsNum/1024;
var inoctetsNumM=inoctetsNumK/1024;
var inoctetsNumG=inoctetsNumM/1024;
inoctetsNum=inoctetsNumG;
inoctetsNum=Math.round(inoctetsNum*100)/100;
unit="GB";
if(inoctetsNum>0){
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
/****主题中的子域名*******/
修改流量统计列表错误提示格式，对service数据保留处理
2018-12-28 18:01:29 +08:00
var topicData=0;
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
$(d.domainData).each(function(j,t){
帮洪庆提交 内容：网站域名统计详情
2018-12-18 03:59:34 +08:00
var domainNum=t.byteCount;
修改流量统计列表错误提示格式，对service数据保留处理
2018-12-28 18:01:29 +08:00
var domainNumK=domainNum/1024;
var domainNumM=domainNumK/1024;
var domainNumG=domainNumM/1024;
domainNum=domainNumG;
domainNum=Math.round(domainNum*100)/100;
topicData=topicData+domainNum;
活跃详情IP增加排序，界面图表园姐增加蓝色风格颜色
2018-12-22 23:11:04 +08:00
data.push({
'id': '2.'+t.webId,
'parent': '1.'+d.topicId,
'name': t.domain,
'value':parseFloat(domainNum)
});
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
})
修改流量统计列表错误提示格式，对service数据保留处理
2018-12-28 18:01:29 +08:00
data.push({
'id': '1.'+d.topicId,
'parent': '0.0',
'name': d.topic,
'value':parseFloat(topicData)
});
}
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
});
Highcharts.getOptions().colors.splice(0, 0, 'transparent');
var chart = Highcharts.chart('chart_topic', {
chart: {
backgroundColor: 'rgba(255, 255, 255, 0)',
plotBackgroundColor:null,
plotBorderWidth:null,
plotShadow:false,
marginTop:50,
marginBottom:10,
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
/* navigation: {
调整流量统计导出按钮位置统一
2018-11-14 11:32:28 +08:00
buttonOptions: {
x:-5,
y:15,
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},*/
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
exporting: {
allowHTML:true,
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
filename:'Service'+addDateName(),
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
chartOptions: {
plotOptions: {
series: {
dataLabels: {
enabled: true,
allowOverlap: true, // 允许数据标签重叠
},
},
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
},
buttons: exportingButton('#6e6379')
流量统计增加导出图片
2018-11-13 19:52:25 +08:00
},
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
//colors:[ '#44A9A8', '#f36f8a','#25f3e6','#ffff43','#964CEC','#32B0ED','#2b6ed7','#7278DD','#2DA9D8','#C66FE6','#0099cc','#cc0033','#ff6633','#99cccc','#d9f9d0'],
活跃详情IP增加排序，界面图表园姐增加蓝色风格颜色
2018-12-22 23:11:04 +08:00
// colors:['#003078','#004bbc', '#015bb1', '#2f74b5', '#4186c1', '#0058e1','#066aff', '#5597cd', '#5c9dff', '#67a7de', '#77b5dc', '#98cde7','#89b9ff','#78adff'],
// colors:['#008ef9','#0594ff', '#002540', '#004679', '#025ba1', '#026fc0','#0279d5'],
// colors:['#002540','#004679','#025ba1', '#026fc0', '#0279d5', '#0086e9', '#008ef9','#0594ff', '#25a2ff', '#63bbff', '#88cbff'],
colors:[ '#1C4573','#275A9C', '#306EB9', '#3579CE', '#3C85E1', '#3E8EF1','#4294F7', '#4294F7', '#98CBFA'],
// colors:colors,
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
noData:{
style: {//设置字体颜色
color: '#fff',
},
},
title: {
text: null
},
credits:{//是否有highcharts水印
enabled:false
},
series: [{
type: "sunburst",
data: data,
allowDrillToNode: true,
cursor: 'pointer',
colorByPoint: true,
dataLabels: {
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
//format: '{point.name}',
/*formatter: function(){
this.point.value = this.point.value.toFixed(2);
this.series.name = this.point.name;
console.info(this);
},*/
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
filter: {
property: 'innerArcLength',
operator: '>',
value: 16
}
},
levels: [{
level: 1,
levelIsConstant: false,
dataLabels: {
rotationMode: 'parallel',
filter: {
property: 'outerArcLength',
operator: '>',
value: 64
}
}
}, {
level: 2,
colorByPoint: true,
dataLabels: {
rotationMode: 'parallel'
活跃详情IP增加排序，界面图表园姐增加蓝色风格颜色
2018-12-22 23:11:04 +08:00
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
},
{
level: 3,
colorVariation: {
key: 'brightness',
活跃详情IP增加排序，界面图表园姐增加蓝色风格颜色
2018-12-22 23:11:04 +08:00
to: 0.5
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
}
}, {
level: 4,
colorVariation: {
key: 'brightness',
to: 0.5
}
}]
}],
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
plotOptions: {
sunburst: {
borderColor: "",
dataLabels: {
enabled: true,
style: {//设置字体颜色
color: '#fff',
fontSize:'11px',
fontFamily:'Microsoft YaHei',
textOutline:'none',
fontWeight:'normal'
},
format: '{point.name}',
}
}
},
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
tooltip: {
headerFormat: "",
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
pointFormat: '<b>{point.name}</b> : <b>{point.value:.2f}<b> ' +unit
流量统计新增端口，主题图
2018-09-21 20:34:48 +08:00
}
});
}
流量统计首页样式更新
2018-12-20 14:32:36 +06:00
function exportingButton(color) {
var button = {
contextButton: {
symbolSize: 12,
symbolX: 11,
symbolY: 10,
symbolStroke: '#e6e6e6',
symbolFill: '#e6e6e6',
width: 21,
height: 20,
theme: {
'stroke-width': 1,
stroke: '#e6e6e6',
r: 0,
fill: color,
states: {
hover: {
fill: color
},
select: {
fill: color
}
}
}
}
};
return button;
}
流量统计首页界面文件导出增加日期后缀
2018-12-27 16:57:42 +08:00
// 加时间后缀名
function addDateName(){
var nowDate=new Date();
var myDate = new Date();
//获取当前年
var year=myDate.getFullYear();
//获取当前月
var month=myDate.getMonth()+1;
//获取当前日
var date=myDate.getDate();
var h=myDate.getHours(); //获取当前小时数(0-23)
var m=myDate.getMinutes(); //获取当前分钟数(0-59)
var s=myDate.getSeconds();
var now=year+""+month+""+date+""+h+""+m+""+s;
return now;
}
Reference in New Issue Copy Permalink