Pixelbox

Create 2D games in JavaScript, made easier · By Cedric Stoquer

Add to collection

Game Engine Community Devlog

Pixelbox community » Meta » Questions

How to scroll a map?

A topic by cappslock created Feb 28, 2021 Views: 254 Replies: 2

Viewing posts 1 to 2

cappslock3 years ago

Hi there,

Been playing around with this a bit. I have a background in web development but not game development. I think I am getting the basics of how to use this, but one thing that's not clear to me is how to implement scrolling for a map.

Couple of questions related to this:

1. Say I have a very wide map in the editor (1600 tiles or so) I can't seem to scroll the "zoomed" part of the map editor. I can zoom in and out, but I can't focus when zoomed in.

2. On an update tick, I am not sure how I would implement scrolling through a map. My best guess is that I would draw the map with a negative x offset equal to the scroll position?

Cedric Stoquer3 years ago(+1)

To scroll the map in the editor, hold the space bar pressed, and click and drag with the mouse.
To implement scrolling in a game, drawing the map with a negative offset will work fine. You ca alternatively use the camera(x, y) function that offset all further rendering to the {x, y} point (use camera(0, 0) to reset to origin). See this tutorial explaining the camera usage.

cappslock3 years ago

Beautiful, thanks!

itch.io

Pixelbox

How to scroll a map?