JavaScript結合canvas獲取圖片某一區域的rgba平均值的方法

獲取圖片rgba的平均值
        function getcolor() {
            //js創建一個canvas元素
            var canvas = document.createElement('canvas');
            //設置canvas的大小，動態獲取也是可以的。
            canvas.width = 600;
            canvas.height = 350;
            //表示繪制一個2d圖
            var context = canvas.getContext("2d");
            //獲取圖片元素
            // var img = document.getElementById('img');
            //創建圖片元素用來加載圖片地址        
            var nimg = new Image();
            nimg.onload = function () {
                var r = 0;
                var g = 0;
                var b = 0;
                var a = 0;
                var fxs = 600 * 300;
                //設置要繪制的圖片
                context.drawImage(nimg, 0, 0);
                //獲取圖片的像素信息，並.data獲得數組
                var data = context.getImageData(0, 0, 600, 300).data;
                //獲取所有的rgba的和
                for (var i = 0; i < data.length / 4; i++) {
                    r += data[i * 4];
                    g += data[i * 4 + 1];
                    b += data[i * 4 + 2];
                    a += data[i * 4 + 3];
                }
                //獲得平均值
                var rgba = 'rgba(' + parseInt(r / fxs) + ',' + parseInt(g / fxs) + ',' + parseInt(b / fxs) +
                    ',' + parseInt(a / fxs) + ')';

                console.log(rgba)

                if (parseInt(r / fxs) > 60 || parseInt(g / fxs) > 60 || parseInt(b / fxs) > 60) {
                    console.log("成功")
                    // console.log(nimg.src)
                    // console.log(img.src)
                    return true;
                    //true
                    // nimg.src = img.src;    
                } else {
                    console.log("失敗")
                    return false;
                    //false                            
                }
            }
            //將圖片地址傳給nimg
            nimg.src = img.src;
        }
        getcolor()