其實JTOTO中報警的處理是通過設置:alarm、alarmColor和setImage(url)來實現的。
alarm屬性不爲null表示有節點報警;
alarmColor屬性設置報警時圖片的顏色。
報警時修改圖片顏色爲alarmColor的代碼在jtopo-min.js中的changeColor方法中實現,具體代碼如下:
function changeColor(a,b,c){
var d=c.split(","),
e=parseInt(d[0]),
f=parseInt(d[1]),
g=parseInt(d[2]),
h=canvas.width=b.width,
i=canvas.height=b.height;
a.clearRect(0,0,canvas.width,canvas.height)
,a.drawImage(b,0,0);
for(var j=a.getImageData(0,0,b.width,b.height),k=j.data,l=0;h>l;l++)for(var m=0;i>m;m++){var n=4*(l+m*h);0!=k[n+3]&&(null!=e&&(k[n+0]+=e),null!=f&&(k[n+1]+=f),null!=g&&(k[n+2]+=g))}
a.putImageData(j,0,0,0,0,b.width,b.height);
var o=canvas.toDataURL();
return o
}
function genImageAlarm(a,b){
var c=a.src+b;
if(alarmImageCache[c])return alarmImageCache[c];
var d=new Image;
return d.src=changeColor(graphics,a,b),alarmImageCache[c]=d,d
}
但是有些圖片報警效果並不如意。所以我做了些修改:
function changeColor(a, b, c) {
var d = c.split(","), e = parseInt(d[0]), f = parseInt(d[1]), g = parseInt(d[2]), h = canvas.width = b.width, i = canvas.height = b.height;
a.clearRect(0, 0, canvas.width, canvas.height), a.drawImage(b, 0, 0);
var j= a.getImageData(0, 0, b.width, b.height),k= j.data,len=k.length;
for (var l = 0; h > l; l++) for (var m = 0; i > m; m++) {
var n = 4 * (l + m * h);
0 != k[n + 3] && (null != e && (k[n + 0] += e), null != f && (k[n + 1] += f), null != g && (k[n + 2] += g))
}
//上面的代碼不能註釋,否則圖片會變小
var qrcolor=c.split(',');
for(var i=0;i<len;i+=4){
k[i] = qrcolor[0];
k[i+1] = qrcolor[1];
k[i+2] = qrcolor[2];
}
a.putImageData(j,0, 0, 0, 0, b.width, b.height);
var o = canvas.toDataURL();
return o
}