2016-07-29 32 views
1

我新嘗試實施洪水填充Java腳本的Java腳本通過從PC加載圖像(草圖),但不能 如果任何人都可以幫助我,我將非常感謝 感謝前進在java腳本洪水填充算法實現

+0

只是能夠添加圖像到畫布這裏是我的代碼 var can = document.getElementById('canvas'); var ctx = can.getContext('2d'); var img = new Image(); img.onload = function() { can.width = img.width; can.height = img.height; ctx.drawImage(img,0,0,img.width,img.height); } img.src ='zlati-nathalie.jpg'; –

回答

0

要將圖像繪製到畫布上,必須首先加載圖像。 這裏是怎麼畫到畫布的例子:

var img = new Image(); 
img.onload = function() { 
    //draw after loading 
    canvas = document.getElementById('case_canvas'); 
    var ctx = canvas.getContext("2d"); 
    ctx.drawImage(img, 0, 0, img.naturalWidth, img.naturalHeight); 
} 

img.src = "http://i.stack.imgur.com/xgNw7.png"; 
//^^ this will start loading the image 

小提琴:https://jsfiddle.net/pmeb1uhm/1/

請注意:你可能因安全問題繪圖位於系統上的圖像(跨域策略)限制。您應該會在瀏覽器控制檯上看到一個錯誤。 我強烈建議在本地主機上運行腳本並使用localhost加載映像,而不是更改瀏覽器安全設置。

+0

感謝它爲我工作 現在你可以請幫助實施洪水填充 我將非常感謝 –

+0

現在你必須訪問像素陣列來啓動算法。如果你不在本地服務器上工作,這種情況下跨源策略可能會導致問題。 開始有很多來源,例如http://stackoverflow.com/questions/17714742/looping-through-pixels-in-an-image。 這裏最重要的是:你得到的數組包括rows/cols/r,g,b,a values – Wolfgang