tilemaps

Automate Phaser tilemap creation and management from Tiled JSON maps.

40.1k|7.2k|Updated Apr 12, 2013
One-click install
npx skills add https://github.com/phaserjs/phaser --skill tilemaps-phaserjs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: tilemaps
Source: https://github.com/phaserjs/phaser/tree/main/skills/tilemaps
Command: npx skills add https://github.com/phaserjs/phaser --skill tilemaps-phaserjs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Tilemaps are essential for constructing 2D tile-based levels. This skill helps you work efficiently with Phaser tilemaps, handling loading, layering, collision, and properties in a structured workflow.

Core Features & Use Cases

  • Loading Tiled JSON maps and tile sheets into Phaser.
  • Creating and managing TilemapLayer and TilemapGPULayer instances.
  • Configuring tile collisions, properties, and region culling for performance.
  • Use cases include prototyping platformers and top-down maps with multiple layers and dynamic tiles.

Quick Start

Preload a Tiled JSON map and its tileset image, then create a layer from the map using map.createLayer('Ground', tileset).

Frequently Asked Questions about tilemaps

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I load a Tiled JSON map and create a layer in Phaser?

To load a Tiled JSON map in Phaser, preload the map file and tileset image, then use the add.tilemap and addTilesetImage APIs before calling map.createLayer to instantiate your TilemapLayer.

What is the difference between TilemapLayer and TilemapGPULayer in Phaser?

TilemapLayer handles standard CPU-based tile rendering, whereas TilemapGPULayer leverages GPU rendering paths to optimize rendering performance for complex 2D tile-based levels.

How do I configure tile collisions for a Phaser tilemap?

Configure Phaser tilemap collisions by setting tile properties within your Tiled JSON map and applying collision configuration APIs, allowing physics bodies to interact correctly with designated solid tiles.

Can I use Phaser tilemaps for top-down maps and platformers with multiple layers?

Yes, Phaser tilemaps support prototyping both top-down maps and platformers, allowing you to manage multiple layers and dynamic tiles while configuring region culling to optimize game performance.

Why does my Phaser tilemap require a tileset image and Tiled JSON file?

Your Phaser tilemap requires a tileset image and Tiled JSON file because the JSON defines the map layout and tile properties, while the image provides the visual tileset graphics required for rendering.

What is the best way to optimize tilemap rendering performance in Phaser?

Optimize Phaser tilemap rendering by utilizing TilemapGPULayer for GPU rendering, organizing multiple layers efficiently, and applying region culling to avoid rendering off-screen tiles during gameplay.