有人知道是否可以使用html5 canvas进行鼠标悬停时的像素颜色跟踪,以在下面的视频中获得相同的结果?
ygp47 回答:在html5画布上跟踪鼠标悬停
这似乎是How to get a pixel's x,y coordinate color from an image?
的副本该文章的最高答案提供了很好的解释,以及links this fiddle的某些代码完全可以满足您的需求。我还包括了下面的JS部分,该部分与jquery有依赖关系
$(function() {
$('img').mousemove(function(e) {
if(!this.canvas) {
this.canvas = $('<canvas />')[0];
this.canvas.width = this.width;
this.canvas.height = this.height;
this.canvas.getContext('2d').drawImage(this,this.width,this.height);
}
var pixelData = this.canvas.getContext('2d').getImageData(event.offsetX,event.offsetY,1,1).data;
$('#output').html('R: ' + pixelData[0] + '<br>G: ' + pixelData[1] + '<br>B: ' + pixelData[2] + '<br>A: ' + pixelData[3]);
});
});