How to draw game in center of screen.

[Majirefy]

Excalibur draws game content on the left top of the screen. Is it possible to change that? Draw the canvas in the center of the screen?

[kamranayub]

If you're looking to change the canvas position, typically we just use CSS to center or put the canvas wherever we need.

The following styles will center the canvas:

canvas { margin: 0 auto }

Older browsers sometimes need text-align: center applied on the parent element (body) but auto margin usually centers elements. Our samples typically center the canvas on screen.

On Wed, Apr 12, 2017, 06:43 Majirefy notifications@github.com wrote:

Excalibur draws game content on the left top of the screen. Is it possible to change that? Draw the canvas in the center of the screen?

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/excaliburjs/Excalibur/issues/780, or mute the thread https://github.com/notifications/unsubscribe-auth/AAiaayU7ubMhf53LYNey9rk-mE2gyXYiks5rvLj-gaJpZM4M7T3p .

[kamranayub]

It wouldn't be a bad idea to have a canvas position parameter in engine options that adds these styles for you. Typically I want more control so I use CSS myself but not everyone knows CSS necessarily

On Wed, Apr 12, 2017, 07:11 Kamran Ayub kamran.ayub@gmail.com wrote:

If you're looking to change the canvas position, typically we just use CSS to center or put the canvas wherever we need.

The following styles will center the canvas:

canvas { margin: 0 auto }

Older browsers sometimes need text-align: center applied on the parent element (body) but auto margin usually centers elements. Our samples typically center the canvas on screen.

On Wed, Apr 12, 2017, 06:43 Majirefy notifications@github.com wrote:

Excalibur draws game content on the left top of the screen. Is it possible to change that? Draw the canvas in the center of the screen?

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/excaliburjs/Excalibur/issues/780, or mute the thread https://github.com/notifications/unsubscribe-auth/AAiaayU7ubMhf53LYNey9rk-mE2gyXYiks5rvLj-gaJpZM4M7T3p .

[Majirefy]

Thanks! @kamranayub Is it possible to use webGL?

[kamranayub]

Not at this time, all the draw logic in Excalibur is based on the 2D context. A core drawing rewrite may lead to webgl support, but not sure yet what implications that'll have.

On Wed, Apr 12, 2017, 07:41 Majirefy notifications@github.com wrote:

Thanks! @kamranayub https://github.com/kamranayub Is it possible to use webGL?

— You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub https://github.com/excaliburjs/Excalibur/issues/780#issuecomment-293563832, or mute the thread https://github.com/notifications/unsubscribe-auth/AAiaa_xnhLgydy5sX_QdAVV5RAAgsFUHks5rvMaTgaJpZM4M7T3p .

[Majirefy]

Thanks!

There are few game engine in TypeScript, and Excalibur is a good one. Happy to see more improvements in the future!

[kamranayub]

Closing in favor of enhancement #781