JavaScript的检测只有土地或水谷歌地图 [英] JavaScript only detect land or water Google Maps

问题描述

我有一个很难搞清楚检测土地VS特定的（纬度，经度）的水JavaScript的唯一途径。得到它的工作用帆布和绕过铬污染的帆布​​错误。想我提出的问题和回答。

解决方案

 函数landOrWater（纬度，经度，回调）{
    VAR map_url = \"http://maps.googleapis.com/maps/api/staticmap?center=\"+lat+\",\"+lng+\"&zoom=\"+map.getZoom()+\"&size=1x1&maptype=roadmap\"
    VAR帆布=使用document.createElement（'画布'）;
    变种CTX = canvas.getContext（'2D'）;    VAR图像=新的图像（）;
    image.crossOrigin =无名氏; //涂料黑客
    image.src = map_url;    image.onload =功能（）{
        canvas.width = image.width;
        canvas.height = image.height;
        canvas.getContext（'2D'）的drawImage（图像，0，0，image.width，image.height）。
        变种PixelData取出= canvas.getContext（'2D'）getImageData（0，0，1，1）。数据。
        如果（PixelData取出[0]≥160安培;＆放大器; PixelData取出[0]＆所述; 181＆放大器;＆放大器; PixelData取出[1]≥190安培;＆放大器; PixelData取出[1]; 210）{
            结果=水;
        }其他{
            结果=土地;
        }
        回调（结果）;
    }
}landOrWater（somelat，somelong，功能（结果）{
    的console.log（结果）;
}）;
 

I was having a hard time figuring out a JavaScript only way to detect land vs water of a specific (lat, lng). Got it working using canvas and bypasses the Chrome tainted canvas error. Thought I'd pose the questions and answer it.

解决方案

function landOrWater( lat, lng, callback ) {
    var map_url = "http://maps.googleapis.com/maps/api/staticmap?center="+lat+","+lng+"&zoom="+map.getZoom()+"&size=1x1&maptype=roadmap"
    var canvas = document.createElement('canvas');
    var ctx = canvas.getContext('2d');

    var image = new Image();
    image.crossOrigin = "Anonymous"; // dope hack
    image.src = map_url;

    image.onload = function() {
        canvas.width = image.width;
        canvas.height = image.height;
        canvas.getContext('2d').drawImage(image, 0, 0, image.width, image.height);
        var pixelData = canvas.getContext('2d').getImageData(0, 0, 1, 1).data;
        if( pixelData[0] > 160 && pixelData[0] < 181 && pixelData[1] > 190 && pixelData[1] < 210 ) {
            result = "water";
        } else {
            result = "land";
        }
        callback(result);
    }
}

landOrWater( somelat, somelong, function(result){
    console.log( result );
});

这篇关于JavaScript的检测只有土地或水谷歌地图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！