Canvas in cordova app not drawing anti aliased

[David_B_12]

N00b here :)

I'm trying to build a drawing app so the first thing I looked at as the Canvas Touch Draw HTML5 + Cordova sample app.  When I run it however, the draw command are not not aliased.

Also when I draw with the mouse it actually looks like the canvas is scaled up slightly as the jagged pixels look bigger than 1 pixel.

These problems are showing up on the software emulator and also hardware.

Any ideas about why these problems happen?

[Amrita_C_Intel]

Hi,

Which version of XDK are you using? Which testing device are you using to test your app?

[David_B_12]

Found an excellent tutorial about how it should be done:

http://codetheory.in/html5-canvas-drawing-lines-with-smooth-edges/

[David_B_12]

Amrita C. (Intel) wrote:

Hi,

Which version of XDK are you using? Which testing device are you using to test your app?

Intel XDK 1912 on Windows.  The issue was noticed on all devices, the emulators and a physical Sony Z3 compact.  I tried the suggested link I found and that solution works very well.  I still don't know why you can't just draw with antialiasing on straight away, rather than using what looks like some sort of display buffer.

[PaulF_IntelCorp]

Why you have to jump through hoops for anti-aliasing is a question for the HTML5 gods. :) The XDK does not prescribe the behavior of the HTML5 runtime engines, it just provides convenient access to them for a packaged app. See this article for a hint as to what this means: http://blogs.intel.com/evangelists/2014/09/02/html5-web-app-webview-app/