캔버스 제출 전에 확인

Question

사용자가 캔버스에 그림을 그릴 수 있고 이미지를 서버의 파일에 저장할 수 있습니다. 캔버스의 기본 검은 색 배경이 있습니다. toDataURL() 함수를 사용하여 캔버스 이미지의 데이터 URL 표현을 제출하기 전에 사용자가 캔버스에 무엇인가를 그렸는지 확인하는 방법이 있습니까? 따라서 사용자가 캔버스에 아무 것도 그리지 않으면 (검정색 배경의 빈 캔버스가 됨) 이미지가 서버에 생성되지 않습니다. 이것을 결정하기 위해 캔버스의 모든 픽셀을 반복해야합니까? 여기 내가 현재하고 있어요 무엇 :

var currentPixels = context.getImageData(0, 0, 600, 400); 
    for (var y = 0; y < currentPixels.height; y += 1) { 

     for (var x = 0; x < currentPixels.width; x += 1) { 
       for (var c = 0; c < 3; c += 1) { 

       var i = (y*currentPixels.width + x)*4 + c; 

       if(currentPixels.data[i]!=0) 
       break; 

       } 

     } 

    } 

Answer 1

무언가가 당신이 그것을 클릭하면 캔버스에 그려진된다고 가정하면, 당신도 캔버스가되었음을 나타내는 플래그를 설정 캔버스에 클릭을 결합 수 위에 그려진. jQuery를 사용하여 예를 들어

는 :

var canvasDrawnOn = false; 

$("#canvas").click(function(){ 
    canvasDrawnOn = true; 
}); 

Answer 2

나는 얼마 전에이 함께했다,하지만 내 목적에 적합하지 않습니다. 당신은을 사용할 필요가 자바 스크립트에 그것을 할,

그런 다음

var imgdata = canvas.toDataURL(); 

내가 PHP에서이 작업을 수행 (MD5 해시를 얻을 수 있지만, 그것은 중요하지 않습니다

먼저 내가 base64로 이미지 데이터를 가지고 이미지 데이터의 같은 this 같은 라이브러리) :

if(h == EMPTYCANVAS) ... 

:이 후

var h = $.md5(imgdata); 

, 당신은 빈 캔버스의 미리 계산 된 해시와 MD5를 비교할 수 있습니다3210

사용자가 이미지 크기를 설정하고 다른 크기의 캔버스가 다른 해시를 가지므로 절대로 작동하지 않습니다. 이 문제를 극복하기위한 제안 (픽셀 단위로 픽셀 이동을 피하면서)은 대단 할 것입니다.