Webgl couldnt load tilemap (texture bound to texture unit 0 is not renderable)

Phaser 3
1

hey guys this is the error msg i get on console:
[.WebGL-0x18b5577b3700]RENDER WARNING: texture bound to texture unit 0 is not renderable. It might be non-power-of-2 or have incompatible texture filtering (maybe)?
images :

pt
pt256×20832 867 KB
final.json (144.3 KB) final.tmx (105.1 KB)
function preload() { this.load.image('tiles', '../pt.png'); this.load.tilemapTiledJSON('tilemap', '../final.json'); var url = 'https://raw.githubusercontent.com/rexrainbow/phaser3-rex-notes/master/dist/rexpinchplugin.min.js'; this.load.plugin('rexpinchplugin', url, true); }
`function create() {
window.addEventListener(‘resize’, resize);
resize();
this.add.image(0, 0, ‘map’).setOrigin(0);

  var map = this.make.tilemap({ key: 'tilemap' });

  var tiles = map.addTilesetImage('pt', 'tiles');

  const layer = map.createStaticLayer(0, tiles);`

for full code:
https://pastebin.com/YTHCt5qu

2

The dimensions of the image you’re using are huge (256x20832), chances are you’re hitting the limits of the rendering capabilities of the device.

1 Like
3

Additionally, you can use game.renderer.getMaxTextureSize() to find the largest texture size supported by your device. Mobile devices usually have stricter limitations. I’d recommend keeping your textures below 1024 pixels, though a desktop could almost certainly handle something much larger (around 4096 or 8196) if you don’t mind the memory usage.