自己要做一个实时的监控数据的图形,但是跟AJAX结合的时候,内存增长的速度 比较快,谁能帮我看看怎么回事,谢谢了!
- waveLineImage = new Highcharts.Chart({
- chart: {
- renderTo: 'waveImage',
- defaultSeriesType: 'line',
- plotBorderWidth: 1,
- plotBorderColor: '#99CC99',
- marginRight: 12,
- showAxes: true
- },
- title: {
- text: '',
- x: -20 //center
- },
- subtitle: {
- text: '',
- x: -20
- },
- xAxis: {
- tickWidth: 0,
- tickInterval: 5,
- gridLineWidth: 1,
- gridLineColor: '#99CC99',
- categories: []
- },
- yAxis: {
- title: {
- text: ''
- },
- min: -1,
- tickInterval: 5,
- gridLineWidth: 1,
- gridLineColor: '#99CC99'
- },
- plotOptions: {
- series: {
- animation: false,
- marker: {
- enabled: false
- }
- }
- },
- tooltip: {
- enabled:false,
- formatter: function(){
- return null;
- }
- },
- legend: {
- enabled: false
- },
- exporting: {
- enabled: false
- },
- series: [{
- name: "monitor",
- data: []
- }, {
- name: "temp",
- data: []
- }]
- });
waveLineImage = new Highcharts.Chart({
chart: {
renderTo: 'waveImage',
defaultSeriesType: 'line',
plotBorderWidth: 1,
plotBorderColor: '#99CC99',
marginRight: 12,
showAxes: true
},
title: {
text: '',
x: -20 //center
},
subtitle: {
text: '',
x: -20
},
xAxis: {
tickWidth: 0,
tickInterval: 5,
gridLineWidth: 1,
gridLineColor: '#99CC99',
categories: []
},
yAxis: {
title: {
text: ''
},
min: -1,
tickInterval: 5,
gridLineWidth: 1,
gridLineColor: '#99CC99'
},
plotOptions: {
series: {
animation: false,
marker: {
enabled: false
}
}
},
tooltip: {
enabled:false,
formatter: function(){
return null;
}
},
legend: {
enabled: false
},
exporting: {
enabled: false
},
series: [{
name: "monitor",
data: []
}, {
name: "temp",
data: []
}]
});
上面是 初始化曲线图的实例
- maxSize = 0;
- lastSize = -1;
- var tempArray = null;
- function drawOscillogram(waveData){
- if (waveData) {
- var dataArray = new Array();
- var array = null, point = null, num = null,item = null;
- var waveDataLength = waveData.length;
- for (var i = 0; i < waveDataLength; i++) {
- array = waveData[i].split(",");
- point = 1 / array.length;
- for (var j = 0; j < array.length; j++) {
- num = i + Math.round((point * j) * 10) / 10;
- item = parseFloat(array[j]);
- if(maxSize<item) maxSize=item;
- dataArray.push([num, item]);
- num = null;
- }
- array = null; item = null; point = null;
- }
- if (waveDataLength < 60) {
- if (tempArray == null) {
- tempArray = new Array();
- for (var i = 0; i < 61; i++) {
- tempArray.push([i, -6]);
- }
- }
- if(!waveLineImage.series[1]) waveLineImage.addSeries("",true,false);
- waveLineImage.series[1].data = tempArray;
- }
- else {
- tempArray = null;
- waveLineImage.series[1].remove();
- }
- waveLineImage.series[0].data = dataArray;
- dataArray = null; waveDataLength = null;
- if(lastSize!=maxSize)
- {
- //new Highcharts.Chart(waveLineImage);
- lastSize=maxSize;
- }else{
- waveLineImage.redraw();
- }
- }
- }
maxSize = 0;
lastSize = -1;
var tempArray = null;
function drawOscillogram(waveData){
if (waveData) {
var dataArray = new Array();
var array = null, point = null, num = null,item = null;
var waveDataLength = waveData.length;
for (var i = 0; i < waveDataLength; i++) {
array = waveData[i].split(",");
point = 1 / array.length;
for (var j = 0; j < array.length; j++) {
num = i + Math.round((point * j) * 10) / 10;
item = parseFloat(array[j]);
if(maxSize<item) maxSize=item;
dataArray.push([num, item]);
num = null;
}
array = null; item = null; point = null;
}
if (waveDataLength < 60) {
if (tempArray == null) {
tempArray = new Array();
for (var i = 0; i < 61; i++) {
tempArray.push([i, -6]);
}
}
if(!waveLineImage.series[1]) waveLineImage.addSeries("",true,false);
waveLineImage.series[1].data = tempArray;
}
else {
tempArray = null;
waveLineImage.series[1].remove();
}
waveLineImage.series[0].data = dataArray;
dataArray = null; waveDataLength = null;
if(lastSize!=maxSize)
{
//new Highcharts.Chart(waveLineImage);
lastSize=maxSize;
}else{
waveLineImage.redraw();
}
}
}
waveData 是 传过来的 数据,把他绑定到图形中 ,内存长的飞快,每秒3MB,怎么修改,怀疑是//new Highcharts.Chart(waveLineImage);这句话增长的内存,然后调用 highCharts 的redraw 方法,重画,可是没有效果出来 求高手 提错!!!!