Javascript 在浏览器中，我可以获得鼠标指向的图像颜色吗？
有一个web应用程序供我构建，我想尝试一些更优雅的东西，而不是图像映射 故事是，将会有一张全球地图，不同的大陆用不同的颜色表示 说澳大利亚是红色的，亚洲是绿色的 当我的鼠标悬停在澳大利亚的形状上时，我的代码会通过检查光标当前指向的颜色来告诉我我在澳大利亚悬停吗 我知道我可以在图像或其他东西上检查鼠标坐标，但我真的想得到不依赖于预定义值/形状/边距的东西Javascript 在浏览器中，我可以获得鼠标指向的图像颜色吗？,javascript,jquery,browser,color-picker,Javascript,Jquery,Browser,Color Picker,有一个web应用程序供我构建，我想尝试一些更优雅的东西，而不是图像映射 故事是，将会有一张全球地图，不同的大陆用不同的颜色表示 说澳大利亚是红色的，亚洲是绿色的 当我的鼠标悬停在澳大利亚的形状上时，我的代码会通过检查光标当前指向的颜色来告诉我我在澳大利亚悬停吗 我知道我可以在图像或其他东西上检查鼠标坐标，但我真的想得到不依赖于预定义值/形状/边距的东西 如有任何想法和建议，将不胜感激。事先非常感谢。这取决于地图的元素类型。浏览器中支持canvas的某些元素肯定是可能的，但不支持整个页面 请参阅我
如有任何想法和建议，将不胜感激。事先非常感谢。这取决于地图的元素类型。浏览器中支持
canvas请参阅我类似问题的答案：合并StackOverflow和其他站点中的各种引用，我使用javascript和JQuery进行了合并：
<html>
<body>
<canvas id="myCanvas" width="400" height="400" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>
<script src="jquery.js"></script>
<script type="text/javascript">
window.onload = function(){
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
var img = new Image();
img.src = 'photo_apple.jpg';
context.drawImage(img, 0, 0);
};
function findPos(obj){
var current_left = 0, current_top = 0;
if (obj.offsetParent){
do{
current_left += obj.offsetLeft;
current_top += obj.offsetTop;
}while(obj = obj.offsetParent);
return {x: current_left, y: current_top};
}
return undefined;
}
function rgbToHex(r, g, b){
if (r > 255 || g > 255 || b > 255)
throw "Invalid color component";
return ((r << 16) | (g << 8) | b).toString(16);
}
$('#myCanvas').click(function(e){
var position = findPos(this);
var x = e.pageX - position.x;
var y = e.pageY - position.y;
var coordinate = "x=" + x + ", y=" + y;
var canvas = this.getContext('2d');
var p = canvas.getImageData(x, y, 1, 1).data;
var hex = "#" + ("000000" + rgbToHex(p[0], p[1], p[2])).slice(-6);
alert("HEX: " + hex);
});
</script>
<img src="photo_apple.jpg"/>
</body>
</html>
您的浏览器不支持画布元素。
window.onload=函数（）{
var canvas=document.getElementById（'myCanvas'）；
var context=canvas.getContext（'2d'）；
var img=新图像（）；
img.src='photo_apple.jpg'；
drawImage（img，0,0）；
};
功能findPos（obj）{
var current_left=0，current_top=0；
if（对象抵销父对象）{
做{
当前_left+=obj.offsetLeft；
当前_top+=对象偏移；
}而（对象=对象抵销母公司）；
返回{x:current\u left，y:current\u top}；
}
返回未定义；
}
函数rgbToHex（r、g、b）{
如果（r>255 | | g>255 | b>255）
抛出“无效颜色组件”；
return（（非常感谢您的快速回答，让我去检查一下！下面是一些关于地图高亮显示的好主意（1）David Lynch的jQuery插件（）和（2）另一个映射器（）