I have some problems on using Canvas which is a new feature in HTML5. I would like to draw somethings in two canvases. Then, I want to send two canvases as an image to server (in c# programming) and compare the different between this two canvases (such
as color and size). If they are identical, it return true; otherwise return false to the confirmation page.
I will use javascript to implement the drawing in canvas. However, I have no idea on sending the canvas drawing to the server. Is there any method to implement it? Is there any reference coding?
var test = document.getElementById("question1").getContext("2d");
for (var i = 0; i<= test.getImageData(0, 0, 300, 100).data.length; i++) {
document.getElementById("testing").value = document.getElementById("testing").value + "," + test.getImageData(0, 0, 300, 100).data[i];
}
I use this code to get the data of the image. However, the explorer have no response. I think this is because of the large calculation time. Since I want to compare two canvas data in server side, is there any efficient method to compare it?
Its not yet implemented Canvas as server control.
try using canvas.toDataURI()
which returns hexadecimal content of image
send it to server by ajax or postback and compare.
Phinehas
Member
362 Points
242 Posts
Canvas in form
Feb 25, 2011 12:45 PM|LINK
Hi,
I have some problems on using Canvas which is a new feature in HTML5. I would like to draw somethings in two canvases. Then, I want to send two canvases as an image to server (in c# programming) and compare the different between this two canvases (such as color and size). If they are identical, it return true; otherwise return false to the confirmation page.
I will use javascript to implement the drawing in canvas. However, I have no idea on sending the canvas drawing to the server. Is there any method to implement it? Is there any reference coding?
Thanks for your help.
Phinehas
Member
362 Points
242 Posts
Re: Canvas in form
Feb 26, 2011 02:16 PM|LINK
Hi
Phinehas
Member
362 Points
242 Posts
Re: Canvas in form
Feb 26, 2011 02:16 PM|LINK
Hi,
var test = document.getElementById("question1").getContext("2d"); for (var i = 0; i<= test.getImageData(0, 0, 300, 100).data.length; i++) { document.getElementById("testing").value = document.getElementById("testing").value + "," + test.getImageData(0, 0, 300, 100).data[i]; }I use this code to get the data of the image. However, the explorer have no response. I think this is because of the large calculation time. Since I want to compare two canvas data in server side, is there any efficient method to compare it?
roopeshreddy
All-Star
20271 Points
3346 Posts
Re: Canvas in form
Feb 26, 2011 02:22 PM|LINK
Hi,
Try creating Canvas element as Server control, by adding runat="server" attribute. Now you can access the Canvas element in the server code.
Get the color and size attributes of the Canvas.
Hope it helps u...
Roopesh Reddy C
Roopesh's Space
Phinehas
Member
362 Points
242 Posts
Re: Canvas in form
Feb 26, 2011 03:33 PM|LINK
I have tested it in debug mode but I fail to find the canvas object in local watch. Also, is there a tag "<asp:Canvas>"?
roopeshreddy
All-Star
20271 Points
3346 Posts
Re: Canvas in form
Feb 26, 2011 03:41 PM|LINK
Hi,
No, there is no such tag in asp server controls. Once HTML 5 is approved by W3C, then you may get that tag.
As of now, it is just HTML 5 tag.
Hope it helps u...
Roopesh Reddy C
Roopesh's Space
raju dasa
Star
14730 Points
2496 Posts
Re: Canvas in form
Feb 26, 2011 06:23 PM|LINK
HI,
canvas is not supported in IE8, it's supported in IE9.
for support in IE8-, u need to use chrome plugin.
or use the latest html5 browsers like: FF,Opera,Chrome.
try debugging with FF plugin: firebug.
---------------
Happy Coding.
Mark as Answer if it helps.
JS Tweet/Feed Reader
rajudasa.blogspot.com || blog@opera
Phinehas
Member
362 Points
242 Posts
Re: Canvas in form
Feb 26, 2011 11:17 PM|LINK
I use <canvas id="question" width="300" height="100" runat="server"></canvas> but cannot receive the canvas in server side (C# programming).
Is there any mistake in my statement?
Phinehas
Member
362 Points
242 Posts
Re: Canvas in form
Feb 26, 2011 11:17 PM|LINK
Yes, I know.
I'm using Chrome to test it.
raju dasa
Star
14730 Points
2496 Posts
Re: Canvas in form
Feb 27, 2011 06:54 AM|LINK
HI,
Its not yet implemented Canvas as server control.
try using canvas.toDataURI()
which returns hexadecimal content of image
send it to server by ajax or postback and compare.
check this:
http://www.w3.org/TR/html5/the-canvas-element.html#dom-canvas-todataurl
---------------
Happy Coding.
Mark as Answer if it helps.
JS Tweet/Feed Reader
rajudasa.blogspot.com || blog@opera