0
내 페이지에서 Google 선형 차트를 사용하고 있습니다. 5 초마다 새로 고침됩니다. 그러나 이상한 것은 차트 크기가 동일하게 유지되지만 각 새로 고침으로 인해 차트 내부의 선이 축소된다는 것입니다.Google 선형 차트 x 축이 전환시 축소됩니다.
내는 스크립트
google.load('visualization', '1', {packages:['corechart']});
google.setOnLoadCallback(drawLine); // call drawChart when google.load() completes
function drawLine() {
var gaugeData = new google.visualization.DataTable();
gaugeData.addColumn('string', 'Time'); // X-Axis
gaugeData.addColumn('number', 'Memory'); // Y-Axis
gaugeData.addColumn('number', 'CPU'); // Y-Axis
var gaugeOptions = {title: 'System Details'}; // Tile of chart
var gauge;
var tempArray; // Store json object value from server
var tempArray2; // Modify json object value from server
gauge = new google.visualization.LineChart(document.getElementById('line_chart_div'));
setInterval(function(){$.ajax({
url: "lineChart.jsp", // Page from which json(new chart values) are fetched
cache: false,
data: {search: "test"},
dataType: "json",
success: function(json2) {
tempArray = (json2.Stats).toString().split(","); // json2.Stats="1:45|34|56,1:55|67|43,......."
var colCount=0;
var i=0; //rowCount
gaugeData.addRows(tempArray.length); // length of array = no. of rows to be inserted(this is always constant)
for (i=0; i < tempArray.length; i++){
tempArray2 = tempArray[i].split("|"); // tempArray2={"1:45","34","56"}..
gaugeData.setValue(i,colCount++,tempArray2[0]); // column1
gaugeData.setValue(i,colCount++,parseInt(tempArray2[1], 10)); // column2
gaugeData.setValue(i,colCount++,parseInt(tempArray2[2], 10)); // column3
colCount=0;
}
gauge.draw(gaugeData, gaugeOptions);
}
});}, 5000);
}
어떻게이 중지합니까!? : |