javascript - 在 HTML5 Canvas 上迭代时获取 X 和 Y 像素坐标 getImageData

标签 javascript html5-canvas

我正在迭代从 canvas 中提取的一些图像数据,如下所示:

var imageData = this.context.getImageData(0, 0, this.el.width, this.el.height);
var data = imageData.data;

for (var i = data.length; i >= 0; i -= 4) {
    if (data[i + 3] > 0) {
        data[i] = this.colour.R;
        data[i + 1] = this.colour.G;
        data[i + 2] = this.colour.B;
    }
}

如何计算当前所在的 X 和 Y 像素坐标?

最佳答案

更正并测试的代码版本:

var x = (i / 4) % this.el.width;
var y = Math.floor((i / 4) / this.el.width);

关于javascript - 在 HTML5 Canvas 上迭代时获取 X 和 Y 像素坐标 getImageData,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13660723/

相关文章:

javascript - HTML5 Canvas 点击并拖动

javascript - 在 testCollision 函数之后查找矩形的哪一侧发生碰撞

javascript - HTML5 Javascript 画笔

javascript - 重复应用 d3 转换导致内存泄漏

javascript - 使用 CSS/JavaScript 安排动画?

javascript - 测试 commonjs 模块的替代方案是什么?

javascript - 打印出 html5 Canvas 的部分

javascript - 无法动态增加对象的属性

javascript - Vuejs : How to implement popover for each dropdown-items

javascript - 在 GSAP 中使用循环来获取多个对象