画折线图

mylove2060

浏览: 330721 次
性别:
来自: 杭州

最近访客更多访客>>

王科敏1号

fs951185627

chqs

vip

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

数据维护


<?php
//performance.php
header('Content-Type: text/xml');
header("Cache-Control: no-cache, must-revalidate");
//A date in the past
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
echo '<?xml version="1.0" encoding="ISO-8859-1"?><items>';
$performancefile="performance.log";
$handle=fopen($performancefile, "r");

while(!feof($handle)){
	$buffer =fgetss($handle,2048);
	$data = explode(",",$buffer);
	
	$columnCount=count($data);
	$line="";
	$s=implode(',',$data); 
	echo '<item>'.$s.'</item>';
}
fclose($handle);
echo "</items>";
?>

ShowChart.php

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css"></style>
<script type="text/javascript" src="FusionCharts.js" charset="gb2312"></script>
<script language="javascript"> 

//异步请求
function Ajax(url) 
{ 
	AjaxObj = getXMLHTTPRequest(); 
	AjaxObj.open("Get",url+"?&sid="+Math.random() ,true);
	AjaxObj.onreadystatechange = processRequest;
	AjaxObj.send(null);
} 

//获取异步对象
function getXMLHTTPRequest()
{
var xmlHttp=null;
try
  {
  // Firefox, Opera 8.0+, Safari,IE8
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("MSxml2.XMLHTTP");


    }
  catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
return xmlHttp;
}


//异步调用获取XML数据
var columnX = 7;			//定义横坐标的列号
var array = [];
var columnCount = 0;
var arrColumnName = new Array();
arrColumnName.push("chart 1");
arrColumnName.push("chart 2");
arrColumnName.push("chart 3");
arrColumnName.push("chart 4");
arrColumnName.push("chart 5");
arrColumnName.push("chart 6");
arrColumnName.push("chart 7");

function processRequest() 
{ 
    if(AjaxObj.readyState == 4) {
		if (AjaxObj.status == 200) {
			var xml = AjaxObj.responseXML;
			var childNodes = xml.getElementsByTagName("items")[0].childNodes;
			var length = childNodes.length;	
			
			for(i = 0; i < length; i++){
				var txtValue; 
				if(childNodes[i].text) { 
					txtValue=childNodes[i].text; 
				}
				else if(childNodes[i].textContent) { 
					txtValue=childNodes[i].textContent;
				}
				arrItems = txtValue.split(",");
				arrLen = arrItems.length;
			
				if(arrLen > 0 && columnCount <= 0){
					columnCount = arrLen;
					array = new Array(columnCount);
					arrLen = array.length;
					for(j = 0; j < arrLen; j++){
						array[j] = [];
					}
				}
				for(k=0; k < arrLen; k++){
					array[k].push(arrItems[k]);
				}
			}
			

			for(col = 0; col < columnCount; col++)
				if(columnX != col){
					ShowChart(array[columnX], array[col], col);
				}
			
		}
	
    }
} 

//过滤时间
function FilterTime(strDateTime, myToday)
{
	var comareDate = 0;
	if(myToday != 0)
	{
		comareDate = myToday;
	}
	else
	{
		var dateObj = new Date();
		comareDate = dateObj.getFullYear() * 10000 + (dateObj.getMonth() + 1) * 100 + dateObj.getDate();
	}



	var date = parseInt(strDateTime.substr(0, 8));
	if(date != comareDate)
	{	
		return true;
	}
	var length = strDateTime.length;
	var time = parseInt(strDateTime.substr(length-6, length));
	if(time >= 60000 && time <= 240000)
		return false;
	return true;
}
//显示画图
//参数1：横坐标数组 参数2：纵坐标数组 参数3:列号，0开始，最后一列为横坐标标列
function ShowChart(arrayX, arrayY, column)
{
	if(column >= columnCount || column < 0)
	{
		return;
	}

	var lengthX = arrayX.length;
	var lengthY = arrayY.length;
	
	if(lengthX != lengthY)
	{
		return;
	}
	var xmlString1 = "<chart><categories>";
	var xmlString2 = "<dataset seriesName='"+arrColumnName[column]+"' color='#36D77A' anchorBorderColor='#36D77A' anchorBgColor='#36D77A'>";
	for(i = 0; i < lengthX; i++)
	{
		if(!FilterTime(arrayX[i], 20111203))
		{
			xmlString1 += "<category label='"+arrayX[i]+"'/>";
			xmlString2 += "<set value='"+arrayY[i]+"'/>";
		}
	}
	xmlString1 += "</categories>";
	xmlString2 += "</dataset>"
	xmlString2 += "<styles><definition><style name='CaptionFont' type='font' size='12'/></definition><application><apply toObject='CAPTION' styles='CaptionFont'/><apply toObject='SUBCAPTION' styles='CaptionFont'/></application></styles></chart>"
	var xmlString = xmlString1 + xmlString2;
	var charId = "ChartId" + column;
	var chart = new FusionCharts("Charts/MSLine.swf", charId, "100%", "400", "0", "0");

	chart.setDataXML(xmlString);
	var divId = "chartdiv" + column;
	tabBody=document.getElementById("chart");
	row=document.createElement("tr");
	cell = document.createElement("td");
	row.appendChild(cell);
	div = document.createElement("div");
	div.id = divId;
	cell.appendChild(div);
	tabBody.appendChild(row);
	chart.render(divId);	
}

//页面启动加载
window.onload = function(){
	Ajax("performance.php")
}

</script> 
</head>
<body>

<table border="0" cellpadding="3" cellspacing="1" class="tableborder" width="90%">
<tbody id="chart">
</tbody>
</table>
</body>
</html>

数据部分

592,589,217561,6758,338152,105197993,108873,20111202130750
1230,1228,1517641,21121,1437997,684437467,769412,20111202133956
1320,1316,2023730,25567,1776256,909127740,1030062,20111202135001
1360,1355,2295666,27806,1949821,1034428301,1173122,20111202135501
1420,1414,2559699,30142,2117392,1149170395,1308714,20111202140001
1476,1472,2868550,32359,2301264,1292349096,1473762,20111202140501
1483,1480,3159544,34581,2469636,1422821214,1624787,20111202141001
1514,1507,3441379,36785,2630757,1547969171,1773293,20111202141502
1552,1545,3733949,38983,2790245,1682479178,1928849,20111202142001
1560,1553,4031698,41225,2954245,1815265101,2084347,20111202142501
1586,1583,4324719,43430,3128562,1942295536,2233282,20111202143001
1661,1654,4626218,45676,3303142,2074599949,2389669,20111202143501
1669,1665,4954866,47900,3478372,2221771368,2560790,20111202144001
1671,1666,5274699,50084,3652078,2361431654,2724658,20111202144501
1658,1653,5594586,52277,3833441,2507764012,2889681,20111202145001
1639,1636,5909268,54481,4025893,2649375492,3050078,20111202145501
1574,1573,6224018,56699,4196302,2786753406,3210659,20111202150001
1135,1127,6479702,58520,4237762,2904832508,3346525,20111202150501
946,944,6633054,59996,4243675,2975124850,3431337,20111202151001
848,845,6757032,61457,4245071,3032744249,3499732,20111202151501
774,773,6867335,62892,4250822,3083094722,3561466,20111202152001
718,714,6968448,64281,4251602,3128094753,3617475,20111202152501
692,688,7059813,65671,4252437,3168495157,3667802,20111202153001
648,645,7148103,67010,4253114,3207712824,3716586,20111202153502
614,610,7232412,68297,4253708,3245535480,3764667,20111202154001
591,589,7313353,69597,4254308,3280975703,3810811,20111202154501
551,549,7389306,70897,4254908,3314560073,3853245,20111202155001
535,532,7459914,72197,4255508,3344894827,3892518,20111202155501
523,521,7530287,73497,4256108,3376083623,3931418,20111202160001
493,490,7604185,75024,4256813,3410041452,3974738,20111202160501
474,472,7670792,76424,4257513,3441615250,4012079,20111202161002
450,448,7733181,77824,4258213,3469087264,4046923,20111202161501
451,448,7809731,81199,4259955,3505321677,4095235,20111202162001
443,442,7874589,83724,4261697,3534878563,4133855,20111202162501
437,435,7932200,86124,4263324,3560239982,4166042,20111202163001
416,410,7985247,88524,4264924,3584471873,4194177,20111202163501
402,399,8038718,90924,4266524,3608561529,4223958,20111202164001
390,387,8095819,93324,4268124,3633330907,4255396,20111202164501
378,376,8150180,95724,4269724,3658951118,4284300,20111202165001
351,349,8200559,98124,4271324,3680684437,4312405,20111202165501
336,333,8245973,100524,4272924,3698929195,4338711,20111202170001
338,334,8290717,102924,4274524,3716893712,4363798,20111202170501
330,326,8332276,105324,4276124,3732833683,4386310,20111202171001
312,308,8373039,107724,4277644,3748681302,4408542,20111202171501
306,304,8412920,110124,4279144,3764142120,4430274,20111202172001
301,298,8453841,112524,4280644,3780530575,4453430,20111202172501
295,293,8494896,114924,4281986,3798120633,4476539,20111202173001

分享到：