# Camera wrap?

**URL:** <https://phaser.discourse.group/t/camera-wrap/1074>\
**Category:** Phaser 3\
**Created:** [February 4, 2019, 5:22pm UTC](https://phaser.discourse.group/t/camera-wrap/1074 "2019-02-04T17:22:51Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Gabriel](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/gabriel/32/645_2.png) [@Gabriel](https://phaser.discourse.group/u/Gabriel)\
**Post date:** [February 4, 2019, 5:22pm UTC](https://phaser.discourse.group/t/camera-wrap/1074/1 "2019-02-04T17:22:51Z")

</div>

I want to achieve this effect:  
 ![path3793](https://global.discourse-cdn.com/free1/uploads/phaser1/original/1X/c96078e2993fbc8c1ee428bf2cdd8991c9ac6177.png)

That when a camera view (pink) reaches the end of the tilemap (dark pink), the view renders in the amount of offset the tilemap of the opposite side.

Ideas? Thanks!

---

<div class="post-metadata">

**Author:** ![jjcapellan](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/jjcapellan/32/542_2.png) [@jjcapellan](https://phaser.discourse.group/u/jjcapellan)\
**Post date:** [February 5, 2019, 7:25pm UTC](https://phaser.discourse.group/t/camera-wrap/1074/2 "2019-02-05T19:25:10Z")

</div>

Hi @Gabriel,  
I think Phaser cameras haven’t a specific method for that.  
If you only need to replicate the background and static objects, you could draw them in rendertextures and position them when the camera reaches a limit of the game.  
This example of infinite scroll uses that concept:

See the Pen [[Phaser3] Infinite scroll using 2 renderTexture objects](https://codepen.io/jjcapellan/pen/NoaGoL/) by Juan Jose Capellan ([@jjcapellan](https://codepen.io/jjcapellan)) on [CodePen](https://codepen.io).

Or maybe the class [TileSprite](https://photonstorm.github.io/phaser3-docs/Phaser.GameObjects.TileSprite.html) can be useful in your case.  
Regards.

---

<div class="post-metadata">

**Author:** ![Sturb](https://avatars.discourse-cdn.com/v4/letter/s/df788c/32.png) [@Sturb](https://phaser.discourse.group/u/Sturb)\
**Post date:** [February 7, 2019, 5:39pm UTC](https://phaser.discourse.group/t/camera-wrap/1074/3 "2019-02-07T17:39:52Z")

</div>

You could try something this:  
[https://labs.phaser.io/edit.html?src=src\game%20objects\tilemap\dynamic\endless%20map.js](https://labs.phaser.io/edit.html?src=src%5Cgame%20objects%5Ctilemap%5Cdynamic%5Cendless%20map.js)  
However instead of picking random tiles, you just start inserting tiles from the beginning of your make so it appears your camera is wrapping around.

---

<div class="post-metadata">

**Author:** ![Gabriel](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/gabriel/32/645_2.png) [@Gabriel](https://phaser.discourse.group/u/Gabriel)\
**Post date:** [February 7, 2019, 6:07pm UTC](https://phaser.discourse.group/t/camera-wrap/1074/4 "2019-02-07T18:07:12Z")

</div>

Interesting! Thanks both you guys.

Right now I have the tilemap to stretch all the viewable area and wrap around using TileSprite @jjcapellan and the next step is having the cursor to also wrap around matching the TilemMap to the TileSprite.
