动态首页调整:流量单位提取到y轴顶端;数字加单位;输出加单位;

This commit is contained in:
dongxiaoyan
2018-12-26 18:44:59 +08:00
parent b2eb6afad9
commit 9b9b76172f
2 changed files with 86 additions and 27 deletions

View File

@@ -43,13 +43,15 @@ public class DynamicIndexController extends BaseController {
String serviceIds = request.getParameter("sid"); String serviceIds = request.getParameter("sid");
String baseNum = request.getParameter("baseNum"); String baseNum = request.getParameter("baseNum");
String hourStr = request.getParameter("hour"); String hourStr = request.getParameter("hour");
String dropBaseNum = request.getParameter("dropBaseNum");
String serviceBaseNum = request.getParameter("serviceBaseNum");
Integer hour = null; Integer hour = null;
if(hourStr!=null &&!"".equals(hourStr)){ if(hourStr!=null &&!"".equals(hourStr)){
hour = Integer.parseInt(hourStr); hour = Integer.parseInt(hourStr);
} }
Object trafficAreaStat = trafficAreaStat(hour, Integer.parseInt(baseNum)); Object trafficAreaStat = trafficAreaStat(hour, Long.valueOf(baseNum));
Object dropStat = dropStat(hour, Integer.parseInt(baseNum)); Object dropStat = dropStat(hour, Long.valueOf(dropBaseNum));
Object logStat = logStat(hour, serviceIds, Integer.parseInt(baseNum)); Object logStat = logStat(hour, serviceIds, Long.valueOf(serviceBaseNum));
Gson gson = new GsonBuilder().create(); Gson gson = new GsonBuilder().create();
String trafficJson = gson.toJson(trafficAreaStat); String trafficJson = gson.toJson(trafficAreaStat);
String dropJson = gson.toJson(dropStat); String dropJson = gson.toJson(dropStat);
@@ -94,7 +96,7 @@ public class DynamicIndexController extends BaseController {
* @param hour 取hour小时内的流量数据默认24小时 * @param hour 取hour小时内的流量数据默认24小时
* @return * @return
*/ */
public Object trafficAreaStat(Integer hour, Integer baseNum) { public Object trafficAreaStat(Integer hour, long baseNum) {
List<Map> results = new ArrayList<>(); List<Map> results = new ArrayList<>();
if (hour == null || hour <= 0) { if (hour == null || hour <= 0) {
@@ -131,7 +133,11 @@ public class DynamicIndexController extends BaseController {
} }
List<Object> point = new ArrayList<>();//每个点 [时间戳, 数值] List<Object> point = new ArrayList<>();//每个点 [时间戳, 数值]
point.add(DateUtils.parseDate(entity.getReportTime()).getTime()); point.add(DateUtils.parseDate(entity.getReportTime()).getTime());
/*if(0<entity.getSum()){//1024*1024*1024=1073741824
point.add(entity.getSum()/1073741824);
}else{
point.add(entity.getSum()); point.add(entity.getSum());
}*/point.add(entity.getSum());
List<List<Object>> points = t.get(entity.getArea());//所有点 List<List<Object>> points = t.get(entity.getArea());//所有点
points.add(point); points.add(point);
@@ -171,7 +177,7 @@ public class DynamicIndexController extends BaseController {
* @param hour 取hour小时内的丢弃数据默认24小时 * @param hour 取hour小时内的丢弃数据默认24小时
* @return * @return
*/ */
public Object dropStat(Integer hour, Integer baseNum) { public Object dropStat(Integer hour, long baseNum) {
List<Map> results = new ArrayList<>(); List<Map> results = new ArrayList<>();
if (hour == null || hour <= 0) { if (hour == null || hour <= 0) {
@@ -235,7 +241,7 @@ public class DynamicIndexController extends BaseController {
* @param hour 取hour小时内的日志数据默认24小时 * @param hour 取hour小时内的日志数据默认24小时
* @return * @return
*/ */
public Object logStat(Integer hour, String serviceIds, Integer baseNum) { public Object logStat(Integer hour, String serviceIds, long baseNum) {
String[] _idsArr = serviceIds.split(","); String[] _idsArr = serviceIds.split(",");
Long[] idsArr = new Long[5]; Long[] idsArr = new Long[5];
for (int i = 0; i < 5; i++) { for (int i = 0; i < 5; i++) {

View File

@@ -265,6 +265,17 @@
top: 5%; top: 5%;
left: -41%; left: -41%;
} }
#dataNumsStr{
font-size:18px;
color:#ffffff;
position: relative;
top: 2.2%;
left: 43%;
font-size: 24px;
}
/* #dataNumsStr span{
margin-left:-45px;font-size:23px;font-family:arial;font-weight:bold;
} */
/* 杂质动态 */ /* 杂质动态 */
.zzdt{ .zzdt{
position: absolute; position: absolute;
@@ -344,8 +355,8 @@
<!-- 数据流出 --> <!-- 数据流出 -->
<div style="margin-left: -187px;margin-top: 11%;"> <div style="margin-left: -187px;margin-top: 11%;">
<div id="linesFlow_chu" style="height: 260px;"></div> <div id="linesFlow_chu" style="height: 260px;"></div>
</div> </div><div id="dataNums" ></div>
<div id="dataNums" ></div> <div id="dataNumsStr"></div>
</div> </div>
<div class="col-sm-3" style="height: 100%"> <div class="col-sm-3" style="height: 100%">
<div class="box_log_bar"> <div class="box_log_bar">
@@ -859,6 +870,7 @@
}, },
grid:{ grid:{
left: 53, left: 53,
top: '35%',
}, },
xAxis: { xAxis: {
type: 'time', type: 'time',
@@ -875,7 +887,7 @@
color: '#fff', color: '#fff',
fontSize: 12, fontSize: 12,
formatter: function(value) { formatter: function(value) {
return echarts.format.formatTime('hh:mm:ss', new Date(value)); return echarts.format.formatTime('hh:mm', new Date(value));
} }
}, },
splitLine: { splitLine: {
@@ -885,6 +897,10 @@
}, },
yAxis: [{ yAxis: [{
type: 'value', type: 'value',
name: 'Bps',
nameTextStyle:{
color:'#ffffff',
},
min: 0, min: 0,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
@@ -898,13 +914,19 @@
fontSize: 12, fontSize: 12,
formatter: function (value, index) { formatter: function (value, index) {
if (value > 1024 && value <= 1048576) { if (value > 1024 && value <= 1048576) {
return value/1024 + " KBps"; return Math.round(value/1024) + " K";//Bps
} }
if (value > 1048576 && value <= 1073741824) { if (value > 1048576 && value <= 1073741824) {
return value/1048576 + " MBps"; return Math.round(value/1048576) + " M";//Bps
} }
if (value > 1073741824) { if (value > 1073741824 && value <= 1099511627776) {
return value/1073741824 + " GBps"; return Math.round(value/1073741824) + " G";//Bps
}
if (value > 1099511627776 && value <= 1125899906842624) {
return Math.round(value/1099511627776) + " T";//Bps
}
if (value > 1125899906842624) {
return Math.round(value/1125899906842624) + " P";//Bps
} }
return value; return value;
} }
@@ -1045,13 +1067,16 @@
axisLabel: { axisLabel: {
formatter: function(value) { formatter: function(value) {
if (value > 1000 && value <= 1000000) { if (value > 1000 && value <= 1000000) {
return value/1000 + " K"; return Math.round(value/1000) + " K";
} }
if (value > 10000000 && value <= 1000000000) { if (value > 1000000 && value <= 1000000000) {
return value/1000000 + " M"; return Math.round(value/1000000) + " M";
} }
if (value > 100000000) { if (value > 1000000000 && value <= 1000000000000) {
return value/1000000000 + " B"; return Math.round(value/1000000000) + " T";
}
if (value > 1000000000000) {
return Math.round(value/1000000000000) + " P";
} }
return value; return value;
}, },
@@ -1189,7 +1214,7 @@
$.ajax({ $.ajax({
type:'get', type:'get',
dataType: 'json', dataType: 'json',
url:'${pageContext.request.contextPath}/nis/dynamicpage/indexLog?hour=24&sid=' + top.indexLogServiceId + "&baseNum=" + top.baseNum, url:'${pageContext.request.contextPath}/nis/dynamicpage/indexLog?hour=24&sid=' + top.indexLogServiceId + "&baseNum=" + top.serviceBaseNum,
success:function(res){//处理返回结果 success:function(res){//处理返回结果
logData = res; logData = res;
_logData = logData.shift(); _logData = logData.shift();
@@ -1219,11 +1244,39 @@
/* 数字特效 */ /* 数字特效 */
function animalNum(dropNum){ function animalNum(dropNum){
var unitStr = "";
if (dropNum > 1000 && dropNum <= 1000000) {
//dropNum = Math.round(dropNum/1000);//K取整
(dropNum/1000).toFixed(1);
unitStr = "K";
}
if (dropNum > 1000000 && dropNum <= 1000000000) {
//dropNum = Math.round(dropNum/1000000);//M
(dropNum/1000000).toFixed(1);
unitStr = "M";
}
if (dropNum > 1000000000 && dropNum <= 1000000000000) {
//dropNum = Math.round(dropNum/1000000000);//G
(dropNum/1000000000).toFixed(1);
unitStr = "G";
}
if (dropNum > 1000000000000 && dropNum <= 1000000000000000) {
//dropNum = Math.round(dropNum/1000000000000);//T
(dropNum/1000000000000).toFixed(1);
unitStr = "T";
}
if (dropNum > 1000000000000000) {
//dropNum = Math.round(dropNum/1000000000000000);//P
(dropNum/1000000000000000).toFixed(1);
unitStr = "P";
}
//dropNum = rand(1000,99999);
//dropNum= dropNum+"M";
$("#dataNums").empty(); $("#dataNums").empty();
//var dropNum = rand(100,99999);;
$("#dataNums").rollNum({ $("#dataNums").rollNum({
deVal:dropNum deVal:dropNum
}); });
$("#dataNumsStr").html("<span>"+unitStr+"</span>");//alert(unitStr);
}; };
function rand(min,max) { function rand(min,max) {