第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

用Js將彩色圖片轉(zhuǎn)換成黑白,失敗

用Js將彩色圖片轉(zhuǎn)換成黑白,失敗

慕工程0101907 2019-03-21 18:13:51
剛剛接觸canvas,學(xué)著把一張圖片轉(zhuǎn)換成黑白的。但是始終不能成功,有點懵逼。謝謝大家。    <body>        <canvas width="500" height="500"></canvas>        <script>            var canvas = document.querySelector("canvas");            var ctx = canvas.getContext("2d");            var image = new Image();            image.onload = function(){                ctx.drawImage(image,0,0);                makeGrayScale();            }            image.src = "images/background.jpg";            var makePixelGrayScale = function (r,g,b,a){                var y = ( 0.3 * r) + ( 0.59 * g ) + ( 0.11 * b);                return {r:y,g:y,b:y,a:y};            };            function makeGrayScale(){                var r,g,b,a;                var imageData = ctx.getImageData(0,0,500, 500)                var numPixels = imageData.data.length/4;                for (var i=0; i<numPixels; i++){                    r = imageData.data[i*4+0];                    g = imageData.data[i*4+1];                    b = imageData.data[i*4+2];                    a = imageData.data[i*4+3];                    pixel = makePixelGrayScale(r,g,b,a);                    imageData.data[i*4+0] = pixel.r;                    imageData.data[i*4+1] = pixel.g;                    imageData.data[i*4+2] = pixel.b;                    imageData.data[i*4+3] = pixel.a;                }                ctx.putImageData(imageData,0,0);            };        </script>    </body>Uncaught DOMException: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.    at makeGrayScale (file:///C:/Users/yocor/Github/aboutCanvas/createCanvas.html:26:37)    at Image.image.onload (file:///C:/Users/yocor/Github/aboutCanvas/createCanvas.html:14:17)
查看完整描述

3 回答

?
尚方寶劍之說

TA貢獻(xiàn)1788條經(jīng)驗 獲得超4個贊

是什么不成功?報了什么錯?出現(xiàn)了什么現(xiàn)象?你不可能就貼一段代碼上來讓回答的人猜吧。

代碼無錯,如果你這邊不能運行,一定是你直接用點開html的方式來運行代碼。

通過這種方式運行的話,你引入的圖片可能會被瀏覽器認(rèn)為是不同的站點,從而canvas在getImageData的時候出現(xiàn)跨域錯誤,canvas不能獲取渲染的跨域的圖片的信息。

如果你想正確運行,需要用IIS或者nginx這樣的東西來做個本地站點,或者使用webpack-dev-server


查看完整回答
反對 回復(fù) 2019-04-02
?
繁花不似錦

TA貢獻(xiàn)1851條經(jīng)驗 獲得超4個贊

提問也是技術(shù)活,要先把你的問題描述清楚,提供必要的素材,想要實現(xiàn)的功能和樣式。


查看完整回答
反對 回復(fù) 2019-04-02
?
天涯盡頭無女友

TA貢獻(xiàn)1831條經(jīng)驗 獲得超9個贊

file:///訪問模式換成http://xxxxxx


查看完整回答
反對 回復(fù) 2019-04-02
  • 3 回答
  • 0 關(guān)注
  • 651 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號