skills.rest
autonomous-ai
autonomous-aiOFFICIAL
Explore all skills by this author →
Website𝕏@autonomous_labsGitHub

tilemaps

Create and manage Phaser 4 tilemaps from Tiled JSON with layers, collision, and tile queries.

465|41|Updated Aug 4, 2026
Search Tags:#game development#webgl#phaser#tilemap#arcade physics#tiled#tile collision
One-click install
npx skills add https://github.com/autonomous-ai/openharness --skill tilemaps-autonomous-ai
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tilemaps
Source: https://github.com/autonomous-ai/openharness/tree/main/store/agents/phaser/skills/tilemaps
Command: npx skills add https://github.com/autonomous-ai/openharness --skill tilemaps-autonomous-ai

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Building tile-based levels in Phaser 4 requires correctly wiring Tiled JSON data, tileset images, layers, and collision flags, where small mismatches in names or missing collision setup cause silent failures. ## Core Features & Use Cases - Tiled Map Loading: Load Tiled JSON maps, link tileset images, and create rendered layers with matching names. - Collision & Physics: Enable tile collision by index, range, property, or exclusion and integrate with Arcade Physics colliders and callbacks. - Dynamic Tile Editing: Query, place, fill, randomize, and replace tiles at runtime, including GPU-accelerated layers via TilemapGPULayer. - Use Case: Build a platformer level by loading a Tiled map, creating ground and foreground layers, setting collision on solid tiles, and spawning enemies from a Tiled object layer. ## Quick Start Load a Tiled JSON map and tileset image in preload, then create the tilemap, add the tileset image, create a layer, and call setCollision on the solid tile indexes.

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 map in Phaser 4?▼

Load the map with this.load.tilemapTiledJSON and the tileset image with this.load.image in preload. In create, call this.add.tilemap, then map.addTilesetImage with the Tiled tileset name, and map.createLayer with the Tiled layer name.

How do I add collision to a tilemap layer in Phaser?▼

Call setCollision with tile indexes, setCollisionBetween for ranges, setCollisionByProperty for Tiled custom properties, or setCollisionByExclusion on the layer. Then add this.physics.add.collider between your sprite and the layer for Arcade Physics to respond.

What is the difference between TilemapLayer and TilemapGPULayer?▼

TilemapGPULayer is a WebGL-only layer that renders the entire layer as one shader quad, limited to orthographic maps, a single tileset, and 4096x4096 tiles. TilemapLayer supports multiple tilesets and all orientations but renders on the CPU path.

Why does createLayer return null in Phaser?▼

createLayer returns null when the layer name does not exactly match the name in Tiled, or when that layer was already created once. Group layer children use the 'GroupName/LayerName' naming convention.

Why are my tile edits not showing on a GPU tilemap layer?▼

TilemapGPULayer does not automatically refresh after edits. After calling putTileAt or other modification methods, call generateLayerDataTexture to regenerate the GPU data texture so changes appear.

Does Phaser support Tiled collection of images tilesets?▼

No, the Phaser Tiled parser does not support Collection of Images tilesets. All tiles in a tileset must come from a single image, and tilesets must be embedded in the exported JSON.

Related Skills

Explore More Software Engineering Skills→
fiandofiando
1

dev-phaser-tilemaps

Implements Phaser 3 tilemap loading, layers, and collision detection from Tiled JSON exports.

Community
Intermediate
onemankingonemanking

tilemaps

Create and manage Phaser 4 tilemaps from Tiled JSON with layers, collision, and tile queries.

Community
Intermediate
GiantCroissant-LunarGiantCroissant-Lunar

loading-assets

Queue and cache Phaser 4 assets during preload with progress events.

Official
Advanced
ArtRivArtRiv

tilemaps

Loads Tiled maps in Phaser Tigame and configures collision and tile callbacks for gameplay systems.

Community
Advanced