How to draw in canvas in GWT

Question

I have this simple jQuery code for drawing a triangle in a 40 by 40 canvas element:

var context1 = $("#arrow_left").get(0).getContext('2d');
context1.beginPath();
context1.moveTo(25,0);
context1.lineTo(0,20);
context1.lineTo(25,40);
context1.lineTo(25,0);
context1.fill();
context1.closePath();

Now how do I do the same thing in GWT? There is a tutorial at http://code.google.com/p/google-web-toolkit-incubator/wiki/GWTCanvas , but the page itself says that that is deprecated and suggests using http://google-web-toolkit.googlecode.com/svn/javadoc/latest/com/google/gwt/canvas/client/Canvas.html . However the latter has no documentation on drawing. Can anyone tell me how to do it in GWT?

Answer 1

With the canvas you can get the Context2d object, which has the same methods as your context1 variable.

Just call the same methods ;-)

Sample Code:

Canvas canvas = Canvas.createIfSupported();
Context2d context1 = canvas.getContext2d();
context1.beginPath();
context1.moveTo(25,0);
context1.lineTo(0,20);
context1.lineTo(25,40);
context1.lineTo(25,0);
context1.fill();
context1.closePath();

Answer 2

I think this following link will help you. It has source code also. http://gwtcanvasdemo.appspot.com/

Before that download jwt-incubator http://www.java2s.com/Code/JarDownload/gwt-incubator/gwt-incubator.jar.zip and add inherited module in .gwt.xml file.Then add this jar to library.