canvas中获取和设置指定点的rgb

/*

* 功能:获取图像中指定点的颜色值

* @param Object obj 图像对象(getImageData()和createImageData())

* @param Number x  图像中点的横坐标

* @param Number y  图像中点的纵坐标\

* @return Array 返回指定像素点颜色组成的数组

*/

function getPixelColor(obj, x, y) {

var color = [];

// 索引值获取方式:纵坐标*图像宽度+横坐标

var index = y * obj.width + x;

color.push(obj.data[index * 4 + 0]);

color.push(obj.data[index * 4 + 1]);

color.push(obj.data[index * 4 + 2]);

color.push(obj.data[index * 4 + 3]);

// 返回数组

return color;

}

/*

* 功能:设置图像中指定点的颜色值

* @param Object obj 图像对象(getImageData()和createImageData())

* @param Number x  图像中点的横坐标

* @param Number y  图像中点的纵坐标

* @param Array color 设置的颜色值(数组)

* @return Array 返回指定像素点颜色组成的数组

*/

function setPixelColor(obj, x, y, color) {

// 将(100,100)颜色为红色

var index = y * obj.width + x;

// 设置代码

obj.data[4 * index + 0] = color[0];

obj.data[4 * index + 1] = color[1];

obj.data[4 * index + 2] = color[2];

obj.data[4 * index + 3] = color[3];

}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容