cc.Sprite.prototype._pixels = []
cc.Sprite.prototype.readPixels = function(x, y){
var w = this.width
var h = this.height
if(!this._pixels || this._pixels.length == 0){
//cc.newElement = function (x) {
// return document.createElement(x);
//};
var canvas = cc.newElement('canvas') // 创建一个新的元素节点
canvas.width = w
canvas.height = h
var ctx = canvas.getContext('2d') // 获得一个2d的画布(通过它就可以这个画布上的像素信息,我们只在上面绘制一张图片)
ctx.drawImage(this.getTexture().getHtmlElementObj(), 0, 0) // 因此获得的像素信息也就等于是这个图片的像素信息
this._pixels = ctx.getImageData(0, 0, w, h).data // 获得像素信息
}
var idx = (h - y) * w * 4 + x * 4 // 根据触摸坐标得到像素上的索引
return [this._pixels[idx], this._pixels[idx + 1], this._pixels[idx + 2], this._pixels[idx + 3]] // 返回这个点上的的像素信息
}
//使用
if (cc.rectContainsPoint(targetObj, pos)) {
var touchPoint = touch.getLocation()
var locationInNode = target.convertToNodeSpace(touchPoint)
var x = locationInNode.x
var y = locationInNode.y
var pexels = target.readPixels(Math.round(x), Math.round(y))
cc.log(Math.round(x), Math.round(y))
cc.log(pexels)
return true
}
参考https://blog.csdn.net/nzb329/article/details/52054252
https://blog.csdn.net/xiaofeiaiai/article/details/44080115
可以写在sprite的extend里
getPixels: function(x, y){
this._pixels = []
var w = this.width
var h = this.height
if(!this._pixels || this._pixels.length == 0){
var canvas = cc.newElement('canvas') // 创建一个新的元素节点
canvas.width = w
canvas.height = h
var ctx = canvas.getContext('2d') // 获得一个2d的画布(通过它就可以这个画布上的像素信息,我们只在上面绘制一张图片)
ctx.drawImage(this.getTexture().getHtmlElementObj(), 0, 0) // 因此获得的像素信息也就等于是这个图片的像素信息</span>
this._pixels = ctx.getImageData(0, 0, w, h).data // 获得像素信息
}
var idx = (h - y) * w * 4 + x * 4 // 根据触摸坐标得到像素上的索引
return [this._pixels[idx], this._pixels[idx + 1], this._pixels[idx + 2], this._pixels[idx + 3]] // 返回这个点上的的像素信息
},
// cocos2d-js 源码中获取颜色的代码
readPixels:function(x,y,w,h) {
if( 'opengl' in cc.sys.capabilities) {
var size = 4 * w * h;
var array = new Uint8Array(size);
gl.readPixels(x, y, w, h, gl.RGBA, gl.UNSIGNED_BYTE, array);
return array;
} else {
// implement a canvas-html5 readpixels
return cc._renderContext.getImageData(x, winSize.height-y-h, w, h).data;
}
},