What is getContext()
method and what is drawing context exactly? why we always pass the string 2d
to the getContext()
method?
Best Answer
Context is a way to choose what you are going to do with your canvas.
For moment you can use getContext for 2d (2dcanvas) or for 3d (WebGL).
HTML5 Specification say's about getContext :"Returns an object that exposes an API for drawing on the canvas. The first argument specifies the desired API. Subsequent arguments are handled by that API."
You can find specifications for each API there :https://html.spec.whatwg.org/multipage/canvas.html#dom-canvas-getcontext
It is also good to know that "webgl" is the correct name for API but for moment, as it is experimental you should use "experimental-webgl" to start creating WebGL content
In Computer graphics, a drawing context is an abstraction (class/object) that encapsulates how you are going to draw stuff.
At a 100k foot level, computer graphics is about converting drawing commands to pixels (image). How you go from commands to pixels is what the graphics pipeline is all about (very broad and deep subject). A drawing context exposes drawing methods and properties to achieve this.
Example of a drawing commands: drawLine, drawPath, drawRect (you get the idea).
Example of drawing properties: fill color, stroke color, stroke style, font size, clipping region etc
In the context (pardon the pun) of web, you have two drawing contexts - canvas for 2d drawing and and webgl for 3d drawing.