Skip to content

Learn: Canvas

Julia Ogris edited this page Aug 3, 2024 · 5 revisions

Canvas

evy outputs drawing commands to a drawing area called the canvas. The canvas is located in the top-right corner of the screen.

evy playground with coordinates and labels

Positions on the canvas are defined by a coordinate system, similar to the Cartesian coordinate system used in mathematics. The horizontal dimension is called the x-axis, and the vertical dimension is called the y-axis.

A point on the canvas is defined by its x and y coordinates, which are written as x y. For example, the point 30 60 has an x-coordinate of 30 and a y-coordinate of 60.

Cartesian coordinates with x and y axes and point (30, 60)

The canvas ranges from coordinates 0 0 to 100 100. This means that the corners of the canvas have the following coordinates:

  • Bottom left: 0 0
  • Bottom right: 100 0
  • Top left: 0 100
  • Top right: 100 100

The center of the canvas has the coordinates 50 50. The point 30 60 is located 30 units from the left edge of the canvas and 60 units from the bottom edge.

evy source.