algorithm - How to draw only the visible pixels which are >0% alpha with a custom color in canvas? -



algorithm - How to draw only the visible pixels which are >0% alpha with a custom color in canvas? -

i create performance nail test png images , other shapes. don't care shapes because technique there no performance issues @ checking (not setup).

i intent collect images on screen in secondary canvas nail test. each image drawn create new color attached particular image. draw of them in canvas, each image have different fill color.

when click on pixel (x, y) color (r, g, b). every color mapped image, image clicked no error (i don't waste finding nail click).

i know limited 256*256*256=16 777 216 items because colors don't think problem now...

so need know how set fill colors on secondary canvas based on visible pixels each image.

update

can see right it's nail test map. if click on black shade (c) instantly know i've clicked on bluish box without other calculation.

one improvement cache alpha data. reuse same alpha info each image instance (we must take care scaling , rotation...).

thanks

here’s how color-mask non-transparent pixels of canvas image.

be sure replace "putyourimagehere.png" own image url.

<!doctype html> <html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script> <style> body{ background-color: ivory; } canvas{border:1px solid blue;} </style> <script> $(function(){ var img=new image(); img.onload=function(){ var red=255; var blue=0; var green=0; var canvascopy=document.getelementbyid("canvascopy"); var ctxcopy=canvascopy.getcontext("2d"); var c=document.getelementbyid("canvas"); var ctx=c.getcontext("2d"); ctx.drawimage(this,0,0); var imgdata=ctx.getimagedata(0,0,c.width,c.height); (var i=0;i<imgdata.data.length;i+=4) { if(imgdata.data[i+3]>0){ imgdata.data[i]=red; imgdata.data[i+1]=green; imgdata.data[i+2]=blue; imgdata.data[i+3]=255; } } ctxcopy.putimagedata(imgdata,0,0); } img.src = "putyourimagehere.png"; }); // end $(function(){}); </script> </head> <body> <canvas id="canvas" width="300" height="300"></canvas> <canvas id="canvascopy" width="300" height="300"></canvas> </body> </html>

algorithm canvas hit

Comments

Post a Comment

Popular posts from this blog

web services - java.lang.NoClassDefFoundError: Could not initialize class net.sf.cglib.proxy.Enhancer -

web services - java.lang.NoClassDefFoundError: Could not initialize class net.sf.cglib.proxy.Enhancer - when trying request rest service @ time of response getting exception.. feb 21, 2013 2:34:49 pm com.sun.jersey.spi.container.containerresponse mapmappablecontainerexception severe: exception contained within mappablecontainerexception not mapped response, re-throwing http container java.lang.noclassdeffounderror: not initialize class net.sf.cglib.proxy.enhancer @ org.hibernate.proxy.pojo.cglib.cgliblazyinitializer.getproxyfactory(cgliblazyinitializer.java:117) @ org.hibernate.proxy.pojo.cglib.cglibproxyfactory.postinstantiate(cglibproxyfactory.java:43) @ org.hibernate.tuple.entity.pojoentitytuplizer.buildproxyfactory(pojoentitytuplizer.java:162) @ org.hibernate.tuple.entity.abstractentitytuplizer.<init>(abstractentitytuplizer.java:135) @ org.hibernate.tuple.entity.pojoentitytuplizer.<init>(pojoentitytuplizer.java:55) @ org.hibernate.tuple.e...
Read more

Accessing MATLAB's unicode strings from C -

Accessing MATLAB's unicode strings from C - how can access underlying unicode info of matlab strings through matlab engine or mex c interfaces? here's example. let's set unicode characters in utf-8 encoded file test.txt, read as fid=fopen('test.txt','r','l','utf-8'); s=fscanf(fid, '%s') in matlab. now if first feature('defaultcharacterset', 'utf-8') , c engevalstring(ep, "s") , output text file utf-8. proves matlab stores unicode internally. if mxarraytostring(enggetvariable(ep, "s")) , unicode2native(s, 'latin-1') give me in matlab: non-latin-1 characters replaced character code 26. need getting access underlying unicode info c string in unicode format (utf-8, utf-16, etc.), , preserving non-latin-1 characters. is possible? my platform os x, matlab r2012b. addendum: documentation explicitly states "[mxarraytostring()] supports multibyte encoded characters...
Read more

javascript - mongodb won't find my schema method in nested container -

javascript - mongodb won't find my schema method in nested container - i trying access method of schema stored within mixed container. here situation : have cases model can many different things, have schema each of these things stored in "casecontent" mixed property. var caseschema = mongoose.schema({ casecontent : {}, object : {type:string, default : "null"}, collision : {type : boolean, default : false} }); the casecontent property filled model of 1 of schemas, 1 exemple : var treeschema = new mongoose.schema({ applecount : {type : number, default : 3} }); treeschema.methods.dostuff = function (data) { console.log('hey, listen'); homecoming true; }; then, want utilize method of schema original container : caseschema.methods.dostuff = function (data) { if (this.casecontent.dostuff !== undefined) { this.casecontent.dostuff(); console.log('it worked'); } else { ...
Read more