JTOPO 修改圖片顏色

其實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
}

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章