[英]Detecting collision with color on a canvas in HTML5+JavaScript
I'm searching for a way in JavaScript how I can detect if an object
like this: 我正在JavaScript中寻找一种方法来检测是否有这样的object
:
var box = {
x: 5,
y: 19,
width: 10,
height: 5,
draw: function(ctx){...draw Box on context "ctx"},
touchingColor: function(ctx,color){...}
}
So basically what I'm looking for is a function touchingColor, that returns true
if my box
is touching the specified color in the specified context. 所以基本上我要寻找的是一个函数touchingColor,如果我的box
在指定的上下文box
触摸了指定的颜色,则返回true
。
Is there a way to accomplish that, or do I need to keep track of the things I drawed on the canvas? 有没有办法做到这一点,还是我需要跟踪在画布上绘制的东西?
Well, I found a way to solve this issue :) Hopefully it helps someone... 好吧,我找到了解决此问题的方法:)希望它可以帮助某人...
var box = {
x: 5,
y: 19,
width: 10,
height: 5,
draw: function(ctx){...draw Box on context "ctx"},
touchingColor: function(ctx,r,g,b){
var data = ctx.getImageData(this.x,this.y,this.width,this.height);
for(var i=0;i<data.length;i+=4){
if(
data[i+0]==r&&
data[i+1]==g&&
data[i+2]==b
){
return true;
}
}
return false;
}
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.