问题2用ie和遨游error loading xml, 问题1:画图横坐标 sin.push([arrDates[i], Math.sin(i)*100]); cos.push([arrDates[i], (Math.cos(i))*100]);如果把横坐标arrDates[i]改为i的话可以正常出图,可换成日期数组的话报错 1.An invalid or illegal string was specified" code: "12 http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js Line 101 2。An invalid or illegal string was specified" code: "12 [Break on this error] ctx.lineTo(drawx, drawy);
用这个替换你自己的这部分,ajax问题就全部解决了 $(function(){ $.ajax({type : "POST", url : "information.xml", dataType:($.browser.msie) ? "text" : "xml", success : function(xml) { if( typeof xml == "string" ){ var oxml = new ActiveXObject("Microsoft.XMLDOM"); oxml.async = false; oxml.loadXML(xml); xml = oxml; } arr=GetNowTime(); alert($(xml).find("computer").length); $(xml).find("computer").each(function() { var computer = $(this); var host = computer.find("host").text(); var cpuUtilityRate = computer.find("cpuUtilityRate").text(); var MemoryUtilityRate = computer.find("MemoryUtilityRate").text(); var Condition = computer.find("Condition").text(); var str= "<tr><td>"+host+"</td><td>"+cpuUtilityRate+"</td><td>"+MemoryUtilityRate+"</td><td>"+Condition+"</td>" $("#tbody1").append(str); arrDates.push(computer ); }) }, error : function(xml) { alert(xml.responseText); //alert("error loading xml"); } }); })
arr是放的是Ajax读去的数据的数组呀,arrDates是放的时间数组,下面这个函数生成的时间,但是我生成时间数组是放在Ajax成功之后执行的。 function GetNowTime()//JS取时间 { var dateNow=new Date(); var daystoadd= -1; var newtime=dateNow.getTime()+(daystoadd*24*60*60*1000); var arrDate =new Array(); for(var i=0;i<24*60/5;i++){ {var newtimems=0; newtimems=newtime+(i*5*60*1000); arrDate[i] = new Date( newtimems );}} return arrDate;}
arr=GetNowTime(); $(xml).find("computer").each(function() { var computer = $(this); var host = computer.find("host").text(); var cpuUtilityRate = computer.find("cpuUtilityRate").text(); var MemoryUtilityRate = computer.find("MemoryUtilityRate").text(); var Condition = computer.find("Condition").text(); var str= "<tr><td>"+host+"</td><td>"+cpuUtilityRate+"</td><td>"+MemoryUtilityRate+"</td><td>"+Condition+"</td>" $("#tbody1").append(str); arrDates.push(computer); }) 这是你的代码,看到什么了吗 arrDates.push的是什么?不是时间吧 arr=GetNowTime();获取了时间没有问题,而且也是个数组。
$(function(){ $.ajax({type : "POST", url : "information.xml", dataType:($.browser.msie) ? "text" : "xml", success : function(xml) { if( typeof xml == "string" ){ var oxml = new ActiveXObject("Microsoft.XMLDOM"); oxml.async = false; oxml.loadXML(xml); xml = oxml; } arr=GetNowTime();把这句改为arrDates=GetNowTime();可以出图,但横坐标显示不是时间,我需要把arrDates怎么转一下,还是别的问题
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.flot.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.js"></script>
<script language="javascript" type="text/javascript" src="js/excanvas.js"></script>
<style type="text/css">
body{margin:0px auto;font-size:12px;}
.topnav{height:29px;background:#284C93;width:100%;
padding: 5px 10px; }
/*顶部导航*/
.topnav p span
{
background-color:#284C93;
border: 1px solid #CCCCCC;
cursor: pointer;
color:white;
width:104px;
height:27px;
display:block;
float:left;
line-height:27px;
text-align:center;
margin-right:4px;
margin-bottom:0px;
margin-top:-12px !important;
margin-top:4px;
border:1px solid #00236F;
}
.topnav p span a
{
height:27px;
line-height:27px;
display:block;
width:100%;
color:white;
text-decoration:none;
font-size:12px;
border:1px solid #4D6FAE;
letter-spacing:6px;}
.topnav p span a.one{
background:url(img/home.png) no-repeat 12px 2px;}
.topnav p span a.two{
background:url(img/shijian.png) no-repeat 12px 2px;}
.topnav p span.current {
background:url(img/tab_select_bg.jpg) center;
color:#053FC3;
font-weight:bold;}
.topnav p span.current a{
color:#053FC3;
font-weight:bold;}
/*内容块*/
.content{}
.contentbox_title{
background:url(img/tab_select_bg.jpg) center;
height:20px;
display:block;
border-bottom:1px solid #A0BED6;
color:#294D95;
font-weight:bold;
line-height:20px;
padding-left:14px;}
.contentbox{
background:#F6FAFF;
border:1px solid #A0BED6;}
.jiaoyilian{
/*width:400px;;
height:250px;
float:left;
margin:12px;*/}
.shiyonglv{
/*width:100%;
height:250px;
margin:12px;float:right;*/}
.tongji{
margin:12px;
display:block;
height:250px;}
/*第二个切换块*/
.tabtwo{}
dd{margin:0px;padding:0px;display:block;float:left;border:1px solid #CCCCCC;margin-right:4px;height:18px;width:80px;text-align:center;}
.selected{background:white;cursor:hand;}
</style>
<script type="text/javascript">
var arr = new Array();var arrDates = new Array();
$(document).ready(function() {
$(".topnav span:first").addClass("current"); //为第一个SPAN添加当前效果样式
$(".topnav span").mouseover(function() {
$(".topnav span").removeClass("current"); //去掉所有SPAN的样式
$(this).addClass("current");
});
//第二个tab切换
$(".tabtwo dd:first").addClass("selected"); //为第一个SPAN添加当前效果样式
$(".tongji ul:not(:first)").hide(); //隐藏其它的UL
$(".tabtwo dd").mouseover(function() {
$(".tabtwo dd").removeClass("selected"); //去掉所有SPAN的样式
$(this).addClass("selected");
$(".tongji ul").hide();
$("." + $(this).attr("id")).fadeIn('slow'); });
$(".jiaoyilian").css({width:"650px",height:"350px",float:"left",margin:"12px 12px 12px 6px"});
$(".shiyonglv").css({height:"250px",flat:"right",margin:"12px"});});
function GetNowTime()//JS取时间
{ var dateNow=new Date();
var daystoadd= -1;
var newtime=dateNow.getTime()+(daystoadd*24*60*60*1000);
var arrDate =new Array();
for(var i=0;i<24*60/5;i++){
{var newtimems=0;
newtimems=newtime+(i*5*60*1000);
arrDate[i] = new Date( newtimems );}}
return arrDate;}
$(function(){$.ajax({type : "POST",url : "information.xml",dataType : "xml",
success : function(xml) {
arr=GetNowTime();
alert(arr[0]);
$(xml).find("computer").each(function() {
var computer = $(this);
var host = computer.find("host").text();
var cpuUtilityRate = computer.find("cpuUtilityRate").text();
var MemoryUtilityRate = computer.find("MemoryUtilityRate").text();
var Condition = computer.find("Condition").text();
//alert(host);alert(cpuUtilityRate);alert(MemoryUtilityRate);alert(Condition);
var str= "<tr><td>"+host+"</td><td>"+cpuUtilityRate+"</td><td>"+MemoryUtilityRate+"</td><td>"+Condition+"</td>"
$("#tbody1").append(str);
arrDates.push(computer ); }) },
error : function(xml) {
alert("error loading xml"); } }); })
$(function () {
var sin = [], cos = [];
for (var i = 0; i < 24*60/10; i ++) {
sin.push([arrDates[i], Math.sin(i)*100]);
cos.push([arrDates[i], (Math.cos(i))*100]);
}
var plot = $.plot($("#chart"),
[ { data: sin, label: "sin(x)"}, { data: cos, label: "cos(x)" } ],
{ lines: { show: true },
selection: { mode: "xy" },
grid: { hoverable: true, clickable: true },
yaxis: { min:0, max: 100 } });
function showTooltip(x, y, contents) {
$('<div id="tooltip">' + contents + '</div>').css( {
position: 'absolute',
display: 'none',
top: y + 5,
left: x + 5,
border: '1px solid #fdd',
padding: '2px',
'background-color': '#fee',
opacity: 0.80
}).appendTo("body").fadeIn(200); }
var previousPoint = null;
$("#chart").bind("plothover", function (event, pos, item) {
$("#x").text(pos.x.toFixed(2));
$("#y").text(pos.y.toFixed(2)); // if ($("#enableTooltip:checked").length > 0) {
if (item) {
if (previousPoint != item.datapoint) {
previousPoint = item.datapoint;
$("#tooltip").remove();
var x = item.datapoint[0].toFixed(2),
y = item.datapoint[1].toFixed(2);
showTooltip(item.pageX, item.pageY,
item.series.label + " of " + x + " , " + y);} }
else {$("#tooltip").remove();
previousPoint = null; } });
$("#chart").bind("plotclick", function (event, pos, item) {
if (item) {
// $("#clickdata").text("You clicked point " + item.dataIndex + " in " + item.series.label + ".");
plot.highlight(item.series, item.datapoint); } }); });
</script>
</head>
<body>
<div class="topnav">
<p>
<span ><a href="#" class="one"> 首页</a></span> <span ><a href="#" class="two">事件</a></span> </p>
</div>
<div class="content">
<div class="contentbox jiaoyilian" >
<div class="contentbox_title">交易量</div>
<div id="chart" style="width:550px;height:260px;">
</div>
</div>
<div class="contentbox shiyonglv">
<div class="contentbox_title">使用率</div>
<div>
<table width="100%">
<thead>
<tr class="contentbox_title" >
<th>主机</th><th>CPU使用率</th><th>内存使用率</th><th>状态</th>
</tr>
</thead>
<tbody id="tbody1">
</tbody>
</table>
</div>
</div>
<div class="tabtwo">
<div class="contentbox tongji ">
<div class="contentbox_title">
<dd id="tab1">交易量统计</dd>
<dd id="tab2">交易错误统计</dd>
</div>
<ul class="tab1">
<li><a href="http://www.poluoluo.com" target="_blank">交易量统计a</a></li><li><a href="http://www.poluoluo.com" target="_blank">交易量统计b</a></li><li><a href="/jzxy/wytx/code/index.html" target="_blank">交易量统计c</a></li></ul>
<ul class="tab2">
<li><a href="/jzxy/wytx/menu/Index.html" target="_blank">交易错误统计1</a></li><li><a href="/jzxy/wytx/jscode/index.html" target="_blank">交易错误统计2</a></li></ul>
</div>
</div>
</div>
</body>
</html>
information.xml
<?xml version="1.0" encoding="UTF-8"?>
<information>
<computer ID="1">
<host>192.168.1.0</host>
<cpuUtilityRate>80%</cpuUtilityRate>
<MemoryUtilityRate>70%</MemoryUtilityRate>
<Condition>重要告警</Condition>
</computer>
<computer ID="2">
<host>192.168.1.2</host>
<cpuUtilityRate>60%</cpuUtilityRate>
<MemoryUtilityRate>60%</MemoryUtilityRate>
<Condition>警告告警</Condition>
</computer>
<computer ID="3">
<host>192.168.1.2</host>
<cpuUtilityRate>60%</cpuUtilityRate>
<MemoryUtilityRate>60%</MemoryUtilityRate>
<Condition>警告告警</Condition>
</computer>
</information>
问题1:画图横坐标
sin.push([arrDates[i], Math.sin(i)*100]);
cos.push([arrDates[i], (Math.cos(i))*100]);如果把横坐标arrDates[i]改为i的话可以正常出图,可换成日期数组的话报错
1.An invalid or illegal string was specified" code: "12
http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js
Line 101
2。An invalid or illegal string was specified" code: "12
[Break on this error] ctx.lineTo(drawx, drawy);
$(function(){
$.ajax({type : "POST",
url : "information.xml",
dataType:($.browser.msie) ? "text" : "xml",
success : function(xml) {
if( typeof xml == "string" ){
var oxml = new ActiveXObject("Microsoft.XMLDOM");
oxml.async = false;
oxml.loadXML(xml);
xml = oxml;
}
arr=GetNowTime();
alert($(xml).find("computer").length);
$(xml).find("computer").each(function() {
var computer = $(this);
var host = computer.find("host").text();
var cpuUtilityRate = computer.find("cpuUtilityRate").text();
var MemoryUtilityRate = computer.find("MemoryUtilityRate").text();
var Condition = computer.find("Condition").text();
var str= "<tr><td>"+host+"</td><td>"+cpuUtilityRate+"</td><td>"+MemoryUtilityRate+"</td><td>"+Condition+"</td>"
$("#tbody1").append(str);
arrDates.push(computer );
})
},
error : function(xml) {
alert(xml.responseText);
//alert("error loading xml");
}
});
})
$(function(){$.ajax({type : "POST",url : "information.xml",dataType : "xml",
success : function(xml) {
arr=GetNowTime();
alert(arr[0]);
$(xml).find("computer").each(function() {
var computer = $(this);
var host = computer.find("host").text();
var cpuUtilityRate = computer.find("cpuUtilityRate").text();
var MemoryUtilityRate = computer.find("MemoryUtilityRate").text();
var Condition = computer.find("Condition").text();
//alert(host);alert(cpuUtilityRate);alert(MemoryUtilityRate);alert(Condition);
var str= "<tr><td>"+host+"</td><td>"+cpuUtilityRate+"</td><td>"+MemoryUtilityRate+"</td><td>"+Condition+"</td>"
$("#tbody1").append(str);
arrDates.push(computer ); }) },
error : function(xml) {
alert("error loading xml"); } }); })我的html文档里还有的一个函数,我觉的和错误没啥关系就没写,(主要是字数超标)等解决后,每天 增加的分全部奖励!!!!(实在是没分了,希望各路高手帮帮忙!!)
$(function(){
alert('two');
$.ajax({
type: "GET",
url: "js/test.js",
dataType: "script"
});
})
test.jssetInterval(
function(){$.ajax({
type : "POST",
url : "information.xml",
dataType : "xml",
success : function(xml) {
alert('success');
},
error : function(xml) {
alert("error load xml");
}
});
}
,50000000)
如果是时间的话 起码也应该是arr吧~~
function GetNowTime()//JS取时间
{ var dateNow=new Date();
var daystoadd= -1;
var newtime=dateNow.getTime()+(daystoadd*24*60*60*1000);
var arrDate =new Array();
for(var i=0;i<24*60/5;i++){
{var newtimems=0;
newtimems=newtime+(i*5*60*1000);
arrDate[i] = new Date( newtimems );}}
return arrDate;}
$(xml).find("computer").each(function() {
var computer = $(this);
var host = computer.find("host").text();
var cpuUtilityRate = computer.find("cpuUtilityRate").text();
var MemoryUtilityRate = computer.find("MemoryUtilityRate").text();
var Condition = computer.find("Condition").text();
var str= "<tr><td>"+host+"</td><td>"+cpuUtilityRate+"</td><td>"+MemoryUtilityRate+"</td><td>"+Condition+"</td>"
$("#tbody1").append(str);
arrDates.push(computer);
}) 这是你的代码,看到什么了吗
arrDates.push的是什么?不是时间吧
arr=GetNowTime();获取了时间没有问题,而且也是个数组。
$.ajax({type : "POST",
url : "information.xml",
dataType:($.browser.msie) ? "text" : "xml",
success : function(xml) {
if( typeof xml == "string" ){
var oxml = new ActiveXObject("Microsoft.XMLDOM");
oxml.async = false;
oxml.loadXML(xml);
xml = oxml;
}
arr=GetNowTime();把这句改为arrDates=GetNowTime();可以出图,但横坐标显示不是时间,我需要把arrDates怎么转一下,还是别的问题
这是去时间函数function GetNowTime()//JS取时间
{ var dateNow=new Date();
var daystoadd= -1;
var newtime=dateNow.getTime()+(daystoadd*24*60*60*1000);
var arrDate =new Array();
for(var i=0;i<24*60/5;i++){
var newtimems=0;
newtimems=newtime+(i*5*60*1000);
arrDate[i] = new Date( newtimems );
}
alert(arrDate[0]);
return arrDate;
}刚刚那个在for里面多写了一个{}
2用这个当横坐标var arrayString2=["1","3","6","7","9","14"];正确出图。横坐标显示2.5,5.0,7.5,10.0,12.5
3用这个当横坐标var arrDateString = ["2010/05/20 20:20","2010/05/21 20:20","2010/05/22 20:20","2010/05/23 20:20","2010/05/24 20:20","2010/05/25 20:20"];;不出图。横坐标显示0.0,0.2,0.4,0.6,0.8,1.0
4 用这个当横坐标var arrDateString2 = ["2010-05-20 20:20","2010-05-21 20:20","2010-05-22 20:20","2010-05-23 20:20","2010-05-24 20:20","2010-05-25 20:20"];不出图。横坐标显示0.0,0.2,0.4,0.6,0.8,1.0