<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY style="margin:0px">
<canvas id="c" οnmοusemοve="pop_alert(event)" style="border:1px solid #c3c3c3;"></canvas>
<div id="xycoordinates" style="float:right"></div>
<SCRIPT LANGUAGE="JavaScript">
// var data = [["58.68.228.104","GET /registerByUnameAjax?uname=2851047_51fanli&username=2851047&password=lekan_51fanli_&email=voeleov@sina.cn&validatecode=homeregister&type=5 HTTP/1.1","200","account","540","1.29","0"], ["58.68.228.104","GET /validateUnameAjax?uname=2881_51fanli HTTP/1.1","200","account","186","2.17","237"],["58.68.228.104","GET /validateUnameAjax?uname=37118534_51bi_com HTTP/1.1","200","account","186","3.13","264"],["58.68.228.104","GET /validateEmailAjax.action?email=13817678568@126.com HTTP/1.1","200","account","186","5.29","5"],["58.68.228.104","GET /validateUnameAjax?uname=2096921_51fanli HTTP/1.1","200","account","186","6.09","264"],["58.68.228.104","GET /registerByUnameAjax?uname=9356816_51fanli&username=9356816&password=lekan_51fanli_&email=liyangfangqq@126.com&validatecode=homeregister&type=5 HTTP/1.1","200","account","545","10.31","631"],["58.68.228.104","GET /registerByUnameAjax?uname=9356816_51fanli&username=9356816&password=lekan_51fanli_&email=liyangfangqq@126.com&validatecode=homeregister&type=5 HTTP/1.1","300","account","545","10.31","0"]];
var data = [ ["27.155.154.171","GET /queryVideoFiles?site=5&version=2.01&entranceId=9602&userId=-1&videoId=133344&videoType=1&idx=1&did=2&s=2 HTTP/1.1","200","account","1165","8.37","207"], ["27.155.154.171","GET /queryVideoFiles?site=5&version=2.01&entranceId=9602&userId=-1&videoId=133344&videoType=1&idx=2&did=2&s=2 HTTP/1.1","200","account","1165","8.38","224"], ["27.155.154.171","GET /queryVideoFiles?site=5&version=2.01&entranceId=9602&userId=-1&videoId=133344&videoType=1&idx=1&did=2&s=2 HTTP/1.1","200","account","1165","8.41","152"], ["27.155.154.171","GET /queryVideoFiles?site=5&version=2.01&entranceId=9602&userId=-1&videoId=133344&videoType=1&idx=2&did=2&s=2 HTTP/1.1","200","account","1165","8.41","155"], ["27.155.154.171","GET /queryVideoFiles?site=5&version=2.01&entranceId=9602&userId=-1&videoId=133344&videoType=1&idx=3&did=2&s=2 HTTP/1.1","200","account","1162","8.51","152"],["27.155.154.171","GET /queryVideoFiles?site=5&version=2.01&entranceId=9602&userId=-1&videoId=133344&videoType=1&idx=3&did=2&s=2 HTTP/1.1","200","account","1162","8.59","152"] ];
var at_time=[8];
var d_length = data.length;
//访问时间作为 间隔点, 响应时长作为 矩形图长度
var b_width = document.documentElement.clientWidth;
var b_height = document.documentElement.clientHeight;
var c=document.getElementById("c");
c.width = b_width - 60;
//alert(d_length);
c.width = c.width - 150;
c.height = d_length * 30 + 30;
var c_avg_width = (c.width) / at_time.length;
alert(c.width+","+c_avg_width);
var cxt=c.getContext("2d");
//X轴名称
for (var m = 0; m<= at_time.length; m++ )
{
cxt.fillText(at_time[m],c_avg_width * m + 150,20);
}
//画横坐标
cxt.moveTo(150, 25);
cxt.lineTo(c.width, 25);
cxt.strokeStyle = "#000";
cxt.stroke();
var bb = new Array();
for (var y =0; y< d_length ;y++ )
{
var a = data[y][5].split(".");
//alert(a[0]+","+a[1]);
for (var u=0 ; u< at_time.length ; u++)
{
if (a[0] == at_time[u])
{
bb.push(u+"."+a[1]);
}
}
}
var p_array = new Array();
for (var x=0 ; x < d_length ; x++)
{
try {
document.body.removeChild(document.getElementById("d1"));
} catch (e) {}
var a_array = new Array();
a_array[0] = parseInt(bb[x] * c_avg_width + 150);
a_array[1] = (30 * (x+1)+10);
a_array[2] = data[x][1];
a_array[3] = data[x][2];
a_array[4] = data[x][3];
a_array[5] = data[x][4];
a_array[6] = data[x][5];
a_array[7] = data[x][6];
p_array.push(a_array);
if(data[x][2] == 200){
cxt.fillStyle = "#00FF00";
}else{
cxt.fillStyle = "#FF0000";
}
cxt.fillText(data[x][1],0,30 * (x+1)+15);
//alert(parseInt(bb[x] * c_avg_width +5)+","+(30 * (x+1)+20));
cxt.fillRect(bb[x] * c_avg_width + 150,30 * (x+1),5,20);
}
//alert(p_array)
function pop_alert(e){
try {
document.body.removeChild(document.getElementById("d1"));
} catch (e) {}
var x=e.clientX;
var y=e.clientY + window.pageYOffset;
var show_info_array = new Array();
//alert((e.clientY + window.pageYOffset)+",y="+y);
document.getElementById("xycoordinates").innerHTML="xy:(" + x + "," + y + ")";
document.getElementById("xycoordinates").style.cssText="position:absolute;top:"+y+"px;left:"+(x+20)+"px";
//alert((parseInt(p_array[0][0])+5)+","+(parseInt(p_array[0][0])+10));
//alert((parseInt(p_array[0][1]) + 11)+","+(parseInt(p_array[0][1]) + 19));
for (var n=0; n< p_array.length ; n++){
// x y轴 +7为X和Y起始点 ,x最大加 7+5 y最大加7+4 为X和Y轴最大点
if (x >= (parseInt(p_array[n][0])) && x <= (parseInt(p_array[n][0])+10) && y >= (parseInt(p_array[n][1])-22) && y <= (parseInt(p_array[n][1]) + 8)){
//alert( "x="+x+" y="+y);
var array_b = new Array();
array_b[0] = p_array[n][2];
array_b[1] = p_array[n][3];
array_b[2] = p_array[n][4];
array_b[3] = p_array[n][5];
array_b[4] = p_array[n][6];
array_b[5] = p_array[n][7]+"ms";
show_info_array.push(array_b);
}
}
show_info(show_info_array,x,y);
}
function show_info(show_info_array,x,y){
var d = document.createElement("div");
d.style.cssText = "position:absolute;top:"+y+"px;left:"+(x+20)+"px";
d.id = "d1";
var content = "";
for (var p=0 ; p < show_info_array.length ; p++ )
{
content += "URL:"+show_info_array[p][0]+"<br/>状态:"+show_info_array[p][1]+"<br/>类型:"+show_info_array[p][2]+"<br/>大小:"+show_info_array[p][3]+"<br/>访问时间:"+show_info_array[p][4]+"<br/>响应时间:"+show_info_array[p][5]+"<br/>";
}
d.innerHTML = content;
document.body.appendChild(d);
}
</SCRIPT>
</BODY>
</HTML>
06-26
9万+
9万+
12-21
“相关推荐”对你有帮助么？
-
非常没帮助 -
没帮助 -
一般 -
有帮助 -
非常有帮助
提交
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
