Wednesday, 24 April 2013

how to check canvas is empty or not

<canvas id="canvas11″ height=”200px” width=”200px”>
<asp:Button runat=”server” ID=”btn1″ Text=”Save”  OnClientClick=”checkcanvas();” />
<script type=”text/javascript”>
function checkcanvas() {
var i = isCanvasTransparent();
//i =true    if canvas empty
//i =false       if canvas has image
}
function isCanvasTransparent() {
var canvas1 = document.getElementById(‘canvas11′);
// true if all pixels Alpha equals to zero
var ctx = canvas1.getContext(“2d”);
var result;
var imageData = ctx.getImageData(0, 0, canvas1.offsetWidth, canvas1.offsetHeight);
for (var i = 0; i < imageData.data.length; i += 4)
if (imageData.data[i + 3] !== 0) return false;
return true;
}
</script>