获取远程jpg图像的左上角像素颜色[重复]答案

【问题标题】：get top left pixel color of remote jpg image [duplicate]获取远程jpg图像的左上角像素颜色[重复]
【发布时间】：2018-02-16 06:01:33
【问题描述】：

假设我们有一个 URL，例如“//upload.wikimedia.org/wikipedia/en/a/a9/Example.jpg”。

如何使用 javascript（jQuery 或 Angular）获取此图像的左上角（或任何 (x,y) 坐标）？

附：当然，图像将属于同一个域以避免 CORS 问题。

附言该图像尚未在 DOM 中。

【问题讨论】：

在提问之前我已经阅读了该解决方案。不，它是针对已经加载到 DOM 中的图像。
你想要图像中的像素数据还是它在 DOM 树中的位置？
Mosh 链接的解决方案将解决问题。图像是否在 DOM 中并不重要。获取像素的唯一方法是在将图像绘制到画布后使用 getImageData（除非您想手动解析图像文件）。
看看这个fiddle

标签： javascript jquery image angular colors

【解决方案1】：

试试这个脚本

<script>
elem = document.getElementById("img");//outer starts at your elem then walks out
var innerYValue = 0;
var innerXValue = 0;

while( elem != null ) {
    innerYValue += elem.offsetTop;
    innerXValue += elem.offsetLeft;
    elem = elem.offsetParent;
}

alert("x: "+innerXValue +"\ny: "+innerYValue);
</script>

【讨论】：