2. GridMap Basics

Leer GridMaps begrijpen door handmatig een kleine stad te bouwen

Overzicht

In dit hoofdstuk leer je:

• Wat een GridMap is en hoe het werkt

• MeshLibrary resources maken en gebruiken

• GridMap coordinate systeem (Vector3I)

• Handmatig buildings plaatsen met GridMap tools

• Tile rotatie en orientatie (24 mogelijke rotaties)

• GridMap Inspector data verkennen

Belangrijk: Dit hoofdstuk bevat nog geen scripting! Je leert GridMaps kennen door handmatig in de editor te werken. In de volgende hoofdstukken ga je scripts schrijven om dit systeem te automatiseren.

De Main Scene Maken

Het startproject bevat nog geen main scene - die ga je nu eerst maken voordat je met GridMaps aan de slag gaat!

1. Klik in het Scene paneel op het + icoon (nieuwe scene)

2. Selecteer 3D Scene (dit maakt een Node3D root node)

3. Hernoem de root node naar Main

4. Voeg een GridMap child node toe aan de Main node

5. Klik op de drie verticale stipjes (⋮) rechts bovenaan in de 3D viewport toolbar

6. Selecteer Add Sun to Scene (voegt DirectionalLight3D toe)

7. Klik opnieuw op de drie stipjes

8. Selecteer Add Environment to Scene (voegt WorldEnvironment toe met sky)

9. Sla de scene op als scenes/main.tscn

   • Klik Scene → Save Scene As...

   • Navigeer naar de scenes/ folder (maak deze aan als die niet bestaat)

   • Noem het bestand main.tscn

Je scene structuur ziet er nu zo uit:

Main (Node3D)
├── GridMap (GridMap)
├── DirectionalLight3D (DirectionalLight3D)
└── WorldEnvironment (WorldEnvironment)

Sla de scene op (Ctrl+S of Cmd+S)!

Wat is een GridMap?

Een GridMap is een Godot node die 3D objecten op een regelmatig raster plaatst - perfect voor tile-based games.

GridMap gebruikt Vector3I (integer coordinaten) voor cell posities:

Vector3I(x, y, z)
  ├─ X: Links (-) / Rechts (+)
  ├─ Y: Beneden (-) / Boven (+)
  └─ Z: Voor (-) / Achter (+)

Belangrijk verschil met world coordinates:

• World: Vector3 met floats (5.5, 0.0, -3.2)

• GridMap: Vector3I met integers (5, 0, -3)

MeshLibrary Maken

Een MeshLibrary is een collectie van 3D tiles die je in een GridMap kan plaatsen. Om een Meshlibrary te maken, plaats je eerst alle 3D models die je als tile wilt gebruiken in een (tijdelijke) scene. Daarna kan je die scene exporteren als een MeshLibrary.

1. MeshLibrary Scene:

   • Klik + (nieuwe scene) en kies Node3D. Hernoem naar CityTiles.

   • (Niet opslaan, dit is tijdelijk).

2. Models toevoegen: Sleep de eerste 15 GLB models uit models/ naar de CityTiles node in het Scene paneel. Zorg dat ze child nodes zijn van CityTiles.

   Lijst: building-garage, building-small-a t/m d, grass, grass-trees varianten, pavement varianten, road varianten.

3. Converteren:

   • Selecteer de CityTiles root node.

   • Ga naar menu Scene → Export As → MeshLibrary....

   • Sla op als: resources/city_tiles.meshlib.

   • Klik Save.

Nu kan je de CityTiles scene sluiten (Don't Save). Godot heeft alle data in het .meshlib bestand opgeslagen.

GridMap Configureren

Nu ga je de MeshLibrary toepassen op de GridMap in de main scene:

1. Open scenes/main.tscn

2. Selecteer de GridMap node

3. Zoek in de Inspector naar Mesh Library

4. Sleep resources/city_tiles.meshlib naar dit veld

   • Of klik op de dropdown → Quick Load → selecteer het bestand

De GridMap is nu klaar voor gebruik!

GridMap Settings Configureren

De 3D models in dit project hebben een specifieke grootte waardoor ze mooi op elkaar aansluiten.

1. Selecteer de GridMap node

2. Zoek in de Inspector naar Cell Size (onder de "GridMap" sectie)

3. Verander de Cell Size naar X: 1, Y: 0.2, Z: 1

4. Scroll verder naar beneden en vind Cell Center Y

5. Schakel Cell Center Y UIT (unchecked/disabled)

GridMap Tools Gebruiken

Met de GridMap node geselecteerd, verschijnt onderaan de editor het GridMap paneel met editing tools.

GridMap Paneel (onderaan editor):

De toolbar bevat verschillende tools (van links naar rechts):

1. Transform - Verplaats/roteer de hele GridMap in de scene

2. Selection - Selecteer een gebied (klik en sleep)

3. Erase - Verwijder tiles (klik op tile in viewport)

4. Paint - Plaats tiles (klik in viewport)

5. Pick - Kopieer tile type van bestaande tile

6. Fill - Vul geselecteerd gebied met gekozen tile

7. Move - Verplaats geselecteerde tiles

8. Duplicate - Dupliceer geselecteerde tiles

9. Delete - Verwijder geselecteerd gebied

10. Cursor Rotate X/Y/Z - Roteer tile die je gaat plaatsen

Mesh Lijst: Onderaan het paneel zie je alle 15 tiles uit je MeshLibrary met preview thumbnails. Klik op een tile om hem te selecteren voor placement.

Belangrijke controls:

• Paint tool + klik in viewport: Plaats geselecteerde tile

• Erase tool + klik: Verwijder tile

• Cursor Rotate buttons: Roteer tile voordat je plaatst

Je Eerste Stad Bouwen

Tijd om handmatig een kleine stad te bouwen!

1. Gras basis:

   • Selecteer grass in het GridMap paneel.

   • Gebruik de Selection tool om een vlak van 10x10 te selecteren.

   • Klik op Fill (of Paint) om het te vullen.

2. Wegen plaatsen:

   • Selecteer road-straight.

   • Gebruik Cursor Rotate Y (sneltoets S) om de weg te roteren indien nodig.

   • Teken een weg met de Paint tool.

3. Gebouwen toevoegen:

   • Selecteer een gebouw (bijv. building-garage).

   • Roteer met S zodat de voorkant naar de weg wijst.

   • Plaats het gebouw naast de weg.

   • Experimenteer met verschillende gebouwen en decoraties (bomen, fontein)!