diff --git a/src/main/webapp/WEB-INF/views/dashboard/ntcTotalReportDetailList.jsp b/src/main/webapp/WEB-INF/views/dashboard/ntcTotalReportDetailList.jsp index 8d8adf230..dbebb6f06 100644 --- a/src/main/webapp/WEB-INF/views/dashboard/ntcTotalReportDetailList.jsp +++ b/src/main/webapp/WEB-INF/views/dashboard/ntcTotalReportDetailList.jsp @@ -190,6 +190,18 @@ }, min:0 }, + tooltip: { + dateTimeLabelFormats: { + millisecond: '%Y-%m-%d %H:%M:%S', + second: '%Y-%m-%d %H:%M:%S', + minute: '%Y-%m-%d %H:%M:%S', + hour: '%Y-%m-%d %H:%M:%S', + day: '%Y-%m-%d %H:%M:%S', + week: '%Y-%m-%d %H:%M:%S', + month: '%Y-%m-%d %H:%M:%S', + year: '%Y-%m-%d %H:%M:%S' + } + }, credits : {//是否有highcharts水印 enabled : false }, diff --git a/src/main/webapp/WEB-INF/views/dashboard/trafficActionTransList.jsp b/src/main/webapp/WEB-INF/views/dashboard/trafficActionTransList.jsp index b8ba528ed..21fd191f0 100644 --- a/src/main/webapp/WEB-INF/views/dashboard/trafficActionTransList.jsp +++ b/src/main/webapp/WEB-INF/views/dashboard/trafficActionTransList.jsp @@ -162,6 +162,18 @@ function showActionTransChart(xData,series){ }, min:0 }, + tooltip: { + dateTimeLabelFormats: { + millisecond: '%Y-%m-%d %H:%M:%S', + second: '%Y-%m-%d %H:%M:%S', + minute: '%Y-%m-%d %H:%M:%S', + hour: '%Y-%m-%d %H:%M:%S', + day: '%Y-%m-%d %H:%M:%S', + week: '%Y-%m-%d %H:%M:%S', + month: '%Y-%m-%d %H:%M:%S', + year: '%Y-%m-%d %H:%M:%S' + } + }, credits:{//是否有highcharts水印 enabled:false }, diff --git a/src/main/webapp/WEB-INF/views/dashboard/trafficAppTypeList.jsp b/src/main/webapp/WEB-INF/views/dashboard/trafficAppTypeList.jsp index f35b6cc27..889254622 100644 --- a/src/main/webapp/WEB-INF/views/dashboard/trafficAppTypeList.jsp +++ b/src/main/webapp/WEB-INF/views/dashboard/trafficAppTypeList.jsp @@ -449,7 +449,17 @@ function protocolTypeChart(rs){ }, tooltip: { headerFormat: '{series.name}
', - pointFormat: '{point.name}: {point.percentage:.2f}%' + pointFormat: '{point.name}: {point.percentage:.2f}%', + dateTimeLabelFormats: { + millisecond: '%Y-%m-%d %H:%M:%S', + second: '%Y-%m-%d %H:%M:%S', + minute: '%Y-%m-%d %H:%M:%S', + hour: '%Y-%m-%d %H:%M:%S', + day: '%Y-%m-%d %H:%M:%S', + week: '%Y-%m-%d %H:%M:%S', + month: '%Y-%m-%d %H:%M:%S', + year: '%Y-%m-%d %H:%M:%S' + } }, series: [{ name: "App", diff --git a/src/main/webapp/WEB-INF/views/dashboard/trafficDomainTrans.jsp b/src/main/webapp/WEB-INF/views/dashboard/trafficDomainTrans.jsp index 1e5fae4a9..8721b2515 100644 --- a/src/main/webapp/WEB-INF/views/dashboard/trafficDomainTrans.jsp +++ b/src/main/webapp/WEB-INF/views/dashboard/trafficDomainTrans.jsp @@ -158,6 +158,18 @@ function showDomainTrans(xData,series){ legend: { enabled:false }, + tooltip: { + dateTimeLabelFormats: { + millisecond: '%Y-%m-%d %H:%M:%S', + second: '%Y-%m-%d %H:%M:%S', + minute: '%Y-%m-%d %H:%M:%S', + hour: '%Y-%m-%d %H:%M:%S', + day: '%Y-%m-%d %H:%M:%S', + week: '%Y-%m-%d %H:%M:%S', + month: '%Y-%m-%d %H:%M:%S', + year: '%Y-%m-%d %H:%M:%S' + } + }, plotOptions: { series: { lineWidth:1, diff --git a/src/main/webapp/WEB-INF/views/dashboard/trafficIpActiveList.jsp b/src/main/webapp/WEB-INF/views/dashboard/trafficIpActiveList.jsp index 6247cb800..a2932c3fd 100644 --- a/src/main/webapp/WEB-INF/views/dashboard/trafficIpActiveList.jsp +++ b/src/main/webapp/WEB-INF/views/dashboard/trafficIpActiveList.jsp @@ -250,8 +250,19 @@ function showIpActiveChart(xData,series){ } }, tooltip: { - pointFormat: ':{series.name} :{point.y}
' - }, + pointFormat: ':{series.name} :{point.y}
', + dateTimeLabelFormats: { + millisecond: '%Y-%m-%d %H:%M:%S', + second: '%Y-%m-%d %H:%M:%S', + minute: '%Y-%m-%d %H:%M:%S', + hour: '%Y-%m-%d %H:%M:%S', + day: '%Y-%m-%d %H:%M:%S', + week: '%Y-%m-%d %H:%M:%S', + month: '%Y-%m-%d %H:%M:%S', + year: '%Y-%m-%d %H:%M:%S' + } + + }, yAxis: { title: { text: 'bytes' diff --git a/src/main/webapp/WEB-INF/views/dashboard/trafficPortActiveList.jsp b/src/main/webapp/WEB-INF/views/dashboard/trafficPortActiveList.jsp index 3e1f1f877..ee31c6193 100644 --- a/src/main/webapp/WEB-INF/views/dashboard/trafficPortActiveList.jsp +++ b/src/main/webapp/WEB-INF/views/dashboard/trafficPortActiveList.jsp @@ -188,6 +188,18 @@ function showPortActiveChart(xData,series){ text: 'bytes' } }, + tooltip: { + dateTimeLabelFormats: { + millisecond: '%Y-%m-%d %H:%M:%S', + second: '%Y-%m-%d %H:%M:%S', + minute: '%Y-%m-%d %H:%M:%S', + hour: '%Y-%m-%d %H:%M:%S', + day: '%Y-%m-%d %H:%M:%S', + week: '%Y-%m-%d %H:%M:%S', + month: '%Y-%m-%d %H:%M:%S', + year: '%Y-%m-%d %H:%M:%S' + } + }, credits:{//是否有highcharts水印 enabled:false }, diff --git a/src/main/webapp/WEB-INF/views/dashboard/trafficProtocolTypeList.jsp b/src/main/webapp/WEB-INF/views/dashboard/trafficProtocolTypeList.jsp index 4a4ad76a8..3f2d50484 100644 --- a/src/main/webapp/WEB-INF/views/dashboard/trafficProtocolTypeList.jsp +++ b/src/main/webapp/WEB-INF/views/dashboard/trafficProtocolTypeList.jsp @@ -442,8 +442,18 @@ function protocolTypeChart(rs){ }, tooltip: { headerFormat: '{series.name}
', - pointFormat: '{point.name}: {point.percentage:.2f}%' - }, + pointFormat: '{point.name}: {point.percentage:.2f}%', + dateTimeLabelFormats: { + millisecond: '%Y-%m-%d %H:%M:%S', + second: '%Y-%m-%d %H:%M:%S', + minute: '%Y-%m-%d %H:%M:%S', + hour: '%Y-%m-%d %H:%M:%S', + day: '%Y-%m-%d %H:%M:%S', + week: '%Y-%m-%d %H:%M:%S', + month: '%Y-%m-%d %H:%M:%S', + year: '%Y-%m-%d %H:%M:%S' + } + }, series: [{ name: "Protocol", colorByPoint: true, diff --git a/src/main/webapp/WEB-INF/views/dashboard/trafficWebTypeList.jsp b/src/main/webapp/WEB-INF/views/dashboard/trafficWebTypeList.jsp index 61b103f9a..ee8af6dfd 100644 --- a/src/main/webapp/WEB-INF/views/dashboard/trafficWebTypeList.jsp +++ b/src/main/webapp/WEB-INF/views/dashboard/trafficWebTypeList.jsp @@ -535,7 +535,17 @@ function webTypeChart(rs){ }, tooltip: { headerFormat: '{series.name}
', - pointFormat: '{point.name}: {point.percentage:.2f}%' + pointFormat: '{point.name}: {point.percentage:.2f}%', + dateTimeLabelFormats: { + millisecond: '%Y-%m-%d %H:%M:%S', + second: '%Y-%m-%d %H:%M:%S', + minute: '%Y-%m-%d %H:%M:%S', + hour: '%Y-%m-%d %H:%M:%S', + day: '%Y-%m-%d %H:%M:%S', + week: '%Y-%m-%d %H:%M:%S', + month: '%Y-%m-%d %H:%M:%S', + year: '%Y-%m-%d %H:%M:%S' + } }, series: [{ name: "Domain", diff --git a/src/main/webapp/static/global/plugins/highcharts/js/offline-exporting.js b/src/main/webapp/static/global/plugins/highcharts/js/offline-exporting.js index 58f5440fb..ffec23b35 100644 --- a/src/main/webapp/static/global/plugins/highcharts/js/offline-exporting.js +++ b/src/main/webapp/static/global/plugins/highcharts/js/offline-exporting.js @@ -285,9 +285,11 @@ License: www.highcharts.com/license downloadJPEG: { textKey: "downloadJPEG", onclick: function () { + this.legend.itemStyle.color='#000000' this.exportChartLocal({ type: "image/jpeg" }) + this.legend.itemStyle.color='#ffffff' } }, downloadSVG: { diff --git a/src/main/webapp/static/pages/scripts/echart.js b/src/main/webapp/static/pages/scripts/echart.js index 07ef36dbf..3382c3405 100644 --- a/src/main/webapp/static/pages/scripts/echart.js +++ b/src/main/webapp/static/pages/scripts/echart.js @@ -4,10 +4,66 @@ chart: { events: { beforePrint: function () { + chart_main.xAxis[0].update({ + labels:{ + style:{ + color:'#000000' + } + } + }) + chart_3.xAxis[0].update({ + labels:{ + style:{ + color:'#000000' + } + } + }) + chart_main.yAxis[0].update({ + labels:{ + style:{ + color:'#000000' + } + } + }) + chart_3.yAxis[0].update({ + labels:{ + style:{ + color:'#000000' + } + } + }) $('.highcharts-legend text').css('color','#000000'); $('.highcharts-legend text').css('fill','#000000'); }, afterPrint: function () { + chart_3.xAxis[0].update({ + labels:{ + style:{ + color:'#ffffff' + } + } + }) + chart_main.xAxis[0].update({ + labels:{ + style:{ + color:'#ffffff' + } + } + }) + chart_main.yAxis[0].update({ + labels:{ + style:{ + color:'#ffffff' + } + } + }) + chart_3.yAxis[0].update({ + labels:{ + style:{ + color:'#ffffff' + } + } + }) $('.highcharts-legend text').css('color','#ffffff'); $('.highcharts-legend text').css('fill','#ffffff'); } @@ -67,6 +123,9 @@ allowHTML:true, filename:'Protocol-Type'+addDateName(), chartOptions: { + chart:{ + backgroundColor: 'rgba(255, 255, 255, 1)' + }, plotOptions: { series: { dataLabels: { @@ -240,7 +299,7 @@ data: [pktNum,byteLen], });*/ }); - var chart = Highcharts.chart('chart_main', { + chart_main = Highcharts.chart('chart_main', { chart: { backgroundColor: 'rgba(255, 255, 255, 0)', plotBackgroundColor:null, @@ -268,25 +327,25 @@ series: { dataLabels: { enabled: true, - allowOverlap: true, // 允许数据标签重叠 - color:'#000000' - }, - }, - xAxis: [{ - labels: { - style: { - color: '#000000' - } + color:'#000000' } - }], - yAxis: [{ - labels: { - style: { - color: '#000000' - } + } + }, + xAxis: [{ + categories: xData, + labels: { + style: { + color: '#000000' } - }] - } + } + }], + yAxis: [{ + labels: { + style: { + color: '#000000' + } + } + }] }, buttons: { contextButton: { @@ -491,7 +550,7 @@ data: [pktNum,byteLen], });*/ }); - var chart = Highcharts.chart('chart_3',{ + chart_3 = Highcharts.chart('chart_3',{ chart: { backgroundColor: 'rgba(255, 255, 255, 0)', plotBackgroundColor:null, @@ -524,7 +583,7 @@ } }, xAxis: [{ - categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], + categories: xData, labels: { style: { color: '#000000' @@ -691,6 +750,9 @@ function echart_2(rs){ allowHTML:true, filename:'BS'+addDateName(), chartOptions: { + chart:{ + backgroundColor: 'rgba(255, 255, 255, 1)' + }, plotOptions: { series: { dataLabels: { @@ -844,6 +906,9 @@ function echart_5(rs){ allowHTML:true, filename:'BS'+addDateName(), chartOptions: { + chart:{ + backgroundColor: 'rgba(255, 255, 255, 1)' + }, plotOptions: { series: { dataLabels: { @@ -992,6 +1057,9 @@ function echart_4(rs){ allowHTML:true, filename:'Website'+addDateName(), chartOptions: { + chart:{ + backgroundColor: 'rgba(255, 255, 255, 1)' + }, plotOptions: { series: { dataLabels: { @@ -1139,6 +1207,9 @@ function echart_6(rs){ allowHTML:true, filename:'Website'+addDateName(), chartOptions: { + chart:{ + backgroundColor: 'rgba(255, 255, 255, 1)' + }, plotOptions: { series: { dataLabels: {