Quantcast
Channel: Pixi.js Latest Topics
Viewing all articles
Browse latest Browse all 3980

Generating a map of tiles

$
0
0

Hello,

I'm trying to generate a world map of tiles. But now I'm stuck, I'm getting an error which is impossible to understand. Maybe you will see what's going wrong:

Quote

Error: TypeError: Cannot read property '_pixiId' of undefined

const MAP_WIDTH = 6400; // when I make this value 3200 or 832 it works else not
const MAP_HEIGHT = 6400; // when I make this value 3200 or 832 it works else not

const MAP_WIDTH = 6400; // when I make this value 3200 or 832 it works else not
const MAP_HEIGHT = 6400; // when I make this value 3200 or 832 it works else not
const TILE_WIDTH = 64;
const TILE_HEIGHT = 64;


map = [
    Array.from({ length: MAP_WIDTH }, (_, i) => {
        if (i <= (MAP_WIDTH / 64) || i % (MAP_WIDTH / 64) === 0 || i % (MAP_WIDTH / 64) === (MAP_WIDTH / 64) - 1 || i >= (Math.pow(MAP_WIDTH / 64, 2)) - (MAP_WIDTH / 64)) {
            return 1
        }
        return 0
    })
]


createMap = () => {
    const cols = MAP_WIDTH / TILE_WIDTH;
    const rows = MAP_HEIGHT / TILE_HEIGHT;

    for (let i = 0; i < this.map.length; i++) {
        const layer = this.map[i];
        for (let j = 0; j < rows; j++) {
            for (let k = 0; k < cols; k++) {
                const imageType = layer[j * cols + k];

                let tile = PIXI.Sprite.from(this.images[imageType]);

                tile.x = k * TILE_WIDTH;
                tile.y = j * TILE_HEIGHT;
                tile.width = TILE_WIDTH;
                tile.height = TILE_HEIGHT;

                this.container.addChild(tile);
            }
        }
    }
}

 


Viewing all articles
Browse latest Browse all 3980

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>