Libgdx TiledMap renders partial tiles

Question

I am having issues with Tiled and Libgdx. I am making a scroll platform game and I am trying to make 1 (for now) background that will repeat itself. The main map in Tiled is composed of various images stacked one next to the other, once I fill all the cells that makes up a full background (normal stuff..)

My problem comes with rendering, as you can see in the images below as I move the main character to the right the image suddenly disappears, I know that the tiled renderer is supposed to efficiently render only what you will see but in this case I am still seeing an area that the renderer just stops rendering.

How can I make the renderer wait until a tile is out of the camera before it stops rendering it?

Images:

Starting position is like at the middle of the first tile

Almost getting out of the first tile

As for the code I am basically using the code in this tutorial since I am currently just testing things out like this:

public class PlayScreen implements Screen {

private OrthographicCamera camera;
private Viewport viewport;

private World world;
private Box2DDebugRenderer b2dRenderer;


// Map

private TiledMap tiledMap;
private OrthogonalTiledMapRenderer mapRenderer;


public PlayScreen(PGame game) {
    this.game = game;
    camera = new OrthographicCamera();
    camera.setToOrtho(false, PGame.V_WIDTH, PGame.V_HEIGHT);       

    viewport = new FitViewport(PGame.V_WIDTH / Constants.PPM, PGame.V_HEIGHT / Constants.PPM, camera);
    camera.position.set(viewport.getWorldWidth() / 4, viewport.getWorldHeight() / 2, 0);

    // No gravity for now..
    world = new World(new Vector2(0, -0*9.81f), true);
    b2dRenderer = new Box2DDebugRenderer();

    // create the box of the player seen in the image
    .....


    TmxMapLoader loader = new TmxMapLoader();

    tiledMap = loader.load("backgrounds/1.tmx");
    float unitScale = 1 / 100f;
    mapRenderer = new OrthogonalTiledMapRenderer(tiledMap, unitScale);




}

public void update(float delta) {

    // handle input to move the b2d body
    .....


    world.step(1 / 60f, 6, 2);

    // Make the camera follow the player
    camera.position.set(player.getPosition());

    camera.update();
}

@Override
public void render(float delta) {
    update(delta);

    Gdx.gl.glClearColor(0, 0, 0, 1);
    Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);


    mapRenderer.setView(camera);
    mapRenderer.render();

    b2dRenderer.render(world, camera.combined);

}

}

@george , like I mentioned above I am using practically the same code explained in the LibGDX wiki. I placed the code here and also I chopped some of the unnecessary code off. Let me know if this helps you help me — Benjamin Vison

Benjamin Vison Benjamin Vison · Accepted Answer · 2015-12-05T15:21:02

Problem is "solved". I tested out the same code with another map that was made with smaller tilesets, apparently this happens if you have tiles too big. Right now the only issue is that some black lines are appearing but that seems to be that the padding is missing. If anyone experience something like this try with smaller tiles.

Libgdx TiledMap renders partial tiles

1 Answers