0
나는 Highcharts 속도계로 작업 해왔다. 속도계에 임의의 숫자가 표시되면 서버가 작동하는지 확인하도록 설정했습니다. 서버가 다운 된 경우, 속도계에 0을 표시하십시오. 나는 그것을 (대부분) 작동했습니다. Firebug를 실행하면서로드합니다. 아파치 서버를 종료하면 0으로 떨어집니다. 나는 서버를 다시 시작하고 난수를 실행하는 것으로 돌아 간다. 문제는 내가 실행할 파이어 버그없이 실행하면 .... 자바 스크립트는 단지 0에 머물러있는 것처럼 보이지 않습니다. 다시 방화범을 피우 자마자 다시 난수를 표시하기 시작합니다. 누구든지 아이디어가 있습니까? 사전에Highcharts 속도계 자바 스크립트가 실행되지 않습니다 onload
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" >
<title>Sales Meter</title>
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
var flag;
var xmlhttp;
var url="http://192.168.0.5/ajax_info.txt";
//ajax call
function loadXMLDoc(url, cfunc){
if(window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}
else {
xmlhttp=new ActiveObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=cfunc;
xmlhttp.open("GET",url, true);
xmlhttp.send();
}
function myFunction(){
loadXMLDoc(url+'?_dc='+(new Date()).getTime(), function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
flag = 1;
}
else {
flag = 0;
}
});
}
$(function() {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'gauge',
plotBackgroundColor: null,
plotBackgroundImage: null,
plotBorderWidth: 0,
plotShadow: false
},
title: {
text: 'Sales-O-Meter'
},
pane: {
startAngle: -150,
endAngle: 150,
background: [{
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, '#FFF'],
[1, '#333']
]
},
borderWidth: 0,
outerRadius: '109%'
}, {
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, '#333'],
[1, '#FFF']
]
},
borderWidth: 1,
outerRadius: '107%'
}, {
// default background
}, {
backgroundColor: '#DDD',
borderWidth: 0,
outerRadius: '105%',
innerRadius: '103%'
}]
},
// the value axis
yAxis: {
min: 0,
max: 100,
minorTickInterval: 'auto',
minorTickWidth: 1,
minorTickLength: 2.5,
minorTickPosition: 'inside',
minorTickColor: '#666',
tickPixelInterval: 15,
tickWidth: 1,
tickPosition: 'inside',
tickLength: 5,
tickColor: '#666',
labels: {
step: 5,
rotation: 'auto'
},
title: {
text: 'sales/min'
},
plotBands: [{
from: 0,
to: 10,
color: '#DF5353' // green
}, {
from: 10,
to: 20,
color: '#DDDF0D' // yellow
}, {
from:20,
to: 100,
color: '#55BF3B' // red
}]
},
series: [{
name: 'Speed',
data: [80],
tooltip: {
valueSuffix: ' sales/sec'
}
}]
},
// Add some life
function (chart) {
setInterval(function() {
myFunction();
if(flag == 1){
var point = chart.series[0].points[0],
newVal,
inc = Math.round((Math.random() - .5) * 20);
newVal = point.y + inc;
if (newVal < 0 || newVal > 100) {
newVal = point.y - inc;
}
point.update(newVal);
}
else{
var point = chart.series[0].points[0],
newVal=0,
inc = 0;
point.update(0);
}
}, 1000);
});
});
</script>
</head>
<body>
<script src="highcharts.js"></script>
<script src="highcharts-more.js"></script>
<!--<script src="exporting.js"></script>-->
<div id="container" style="width: 500px; height: 400px; margin: 0 auto"></div>
</body>
</html>
감사합니다!
아니요 ... 설명해주세요. – Psyllex
아니, 도움이되지 않았다. 하이 차트 함수 전체를 명명하고 onload에서 실행해야한다고 생각하십니까? – Psyllex
함수의 이름을 지정하고 다음을 사용합니다.
도움이되지 않았습니다. – Psyllex