Jump to content

Infinte scrolling in Pixi.js


Recommended Posts

Hello friends,

I'm totally new to Pixi.js and canvas in general. I'm trying to develop my favorite board game Patchwork, where I have a scrollable container with patches from which player can select one. Above the canvas I have two buttons for controlling the scrolling direction. Each time player clicks on one of these buttons, the x coordinate of the container updates. 

I was wondering if there is any 'best practice' way to implement infinite scrolling of the container (such as creating an infinite image gallery)? I have a few ideas, but I wan't to hear other opinions before I really dive into implementing the solution to this problem. 

Here are some screenshots for reference:



Thank you in advance!

Edited by dnbnina94
Link to comment
Share on other sites

I can't really think of a best practice for this really apart from only deleting/recreating sprites that you have to.

You probably have some idea where off-screen objects get moved on to the end of the stack, or get deleted then recreated... and either will probably be fine depending on the sprite count.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...