Class: Position


A Position gives a precise location on the canvas or map. Map-based positions move with the map while cavas-based-position do not.

Canvas-based positions

Positions on the canvas are described using position names or x/yPercents.

Position Names

String xPercent yPercent
top-left 0 0
top-center 50 0
top-right 100 0
middle-left 0 50
middle-center 50 50
middle-right 100 50
bottom-left 0 100
bottom-center 50 100
bottom-right 100 100

Canvas-based position examples:

  • value: { xPercent: 50, yPercent: 40 }
  • value: 'top-left'

Map-based positions

Map-based positions are described with an object containing lengthPercent and mapOffset values.

  • lengthPercent: Number between 0 and 100 (%) indicating the position as a percentage of the the map length.
  • mapOffset: pixel distance from the map
    • values above 0: add to outside edge of map
    • values below 0: substract from inside edge of map

Map-based position examples:

  • value: { lengthPercent: 23, mapOffset: 10 }

new Position(value)

Creating a Position. The default value for Position will be 'middle-center'.

Name Type Description
value String | Object

A string describing the position or an object. The object properties will depend on the position type. NOTE: see examples above.


  • value: { lengthPercent: 23, mapOffset: 10 }
  • value: { xPercent: 50, yPercent: 40 }
  • value: 'top-left'



Get or set where this position is relative to. Values: 'canvas' or 'map'.


Get the x/y values for the position as a point.


Get the x value for the position.


Get the y value for the position.



Return the class name as a string.

Type Description
  • 'Position'