Page 1 of 1

Simple RPG Map Generator Rate Topic: -----

#1 xxxjj18  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 53
  • View blog
  • Posts: 167
  • Joined: 30-November 11

Posted 05 December 2011 - 05:13 PM

Welcome! In this tutorial, we will learn how to create a simple RPG map generator. By the end of this tutorial, we will have created a class that handles a map file, converts it into an array, and displays the map using tiles.

Prerequisites

1.) Basic knowledge of HTML
2.) Intermediate knowledge of PHP

Overview

-The map generator will consist of one php file, "map.class.php", and will be included through the file "map.php".
-The Map class will contain three variables--all of which are arrays; $mapArray, $tileSet, and $map
-The Map class will contain two functions (excluding the __construct() function); generateMap and showMap

To begin, we need to create the "map.class.php" file, which contains the Map class's properties:
<?php

/** Map Reader Class
  * Used to generate and display RPG style maps
  * Last edited: 12-5-11
  */
  

class Map {


};

?>



Now that we have the basic structure of our Map class, we need to declare the class's variables that will be used (These will be located below the class declaration):

protected $mapArray = Array(); // Reading of the map file's contents
public $tileSet = Array(); //     Final outcome of each tile
protected $map = Array(); //      Rows/Columns of the map



So far our Map class consists of a few comments and three arrays. We now need to define what happens upon construction of the class:

public function __construct($file, $imageLocation) {
		
		//Generate map array based off of file
		
		$handle = @fopen($file, "r");


		if ($handle) {
			while (($buffer = fgets($handle, 4096)) !== false) {
				
				//Currently in the map file's contents

			}
			if (!feof($handle)) {
				print "Error: unexpected fgets() fail\n";
				die();
			}
			fclose($handle);
		}
		
		
	}



What we just did was defined the __construct function of the class. Upon construction, the class will attempt to load the map file "$file", and will go through each line of the file. Though it's included, we don't need to worry about $imageLocation just yet.

*Note: If you would like for the Map class to read lines that exceed 4096 characters, simply adjust the script to your liking.*

Now that we can read the file, we need to actually do something with it's contents; this is where $mapArray comes in. The way our Map class works, it reads the file's contents line by line, and stores each character in each line in the $mapArray array, in order by each row (or line, when in the file) in the map:

public function __construct($file, $imageLocation) {
		
		//Generate map array based off of file
		
		$handle = @fopen($file, "r");

		$i = 0;

		if ($handle) {
			while (($buffer = fgets($handle, 4096)) !== false) {
				
				//Currently in the map's rows
				
				$row = explode(",", $buffer);
				
				foreach($row as $tile)
				{
					//This is each individual tile within each row
					
					$mapArray[$i][] = $tile;
				}
				
				$i++;
			}
			if (!feof($handle)) {
				print "Error: unexpected fgets() fail\n";
				die();
			}
			fclose($handle);
		}
		

		
	}



In the above example, we increment a variable, $i. $i is used to keep track of each row in the map, and store each tile in the map accordingly within the $mapArray array.

Now that we've populated $mapArray, we need to generate the images for each tile that will be used in the map. This is where the generateMap function comes in handy:

protected function generateMap($mapset, $image) {
	
		//Generate map based on the mapArray
		
		$i = 0;
		
		foreach($mapset as $row)
		{
			//Current row in the mapArray
			
			foreach($row as $tile)
			{
				//Current tile in the mapArray
				
				$map[$i][] = "<img src=\"".$image."/".$tile.".png\" />";
			}
			
			$i++;
		}
		
		return $map;
	}



What we just did is took each tile from each row of the $mapArray array, and set the $map array's contents to an image based on the tile's number. Once finished, the generateMap function returns the $map array.

Now that we are able to generate a map and it's tiles, we need to set it's tileset, by adding this code underneath within the __construct method:

$this->tileSet = $this->generateMap($mapArray, $imageLocation);
		
		if($this->tileSet == null)
		{
			print "Unexpected error generating map.\n";
			die();
		}



This code sets the $tileSet array's values to the image files of each tile, and then checks to confirm that the $tileSet array is not empty, in which an error has occurred.

Now that we have our __construct method and our generateMap function, all we need to create is the showMap function, so that the map will actually be displayed:

public function showMap() {
	
		//Show the map
		
		
		if($this->tileSet != null)
		{
			
			
			$i = 0;
		
			foreach($this->tileSet as $row)
			{
				//Current row in the tileSet
				
				foreach($row as $tile)
				{
					//Current tile in the tileSet
					
					print $tile;
				}
				
				print "<br />";
				
				$i++;
			}
			
		}else{
			print "Tileset is empty.\n";
			die();
		}
	}



The showMap function is almost identical to the generateMap function; the only difference is that instead of returning the row and column numbers, the function displays the images for each tile within the $tileSet array.

The "map.class.php" file should now look something like this:

<?php

/** Map Reader Class
  * Used to generate and display RPG style maps
  * Last edited: 12-5-11
  */
  

class Map {

	protected $mapArray = Array(); // Reading of the map file's contents
	public $tileSet = Array(); //     Final outcome of each tile
	protected $map = Array(); //      Rows/Columns of the map

	public function __construct($file, $imageLocation) {
		
		//Generate map array based off of file
		
		$handle = @fopen($file, "r");

		$i = 0;

		if ($handle) {
			while (($buffer = fgets($handle, 4096)) !== false) {
				
				//Currently in the map's rows
				
				$row = explode(",", $buffer);
				
				foreach($row as $tile)
				{
					//This is each individual tile within each row
					
					$mapArray[$i][] = $tile;
				}
				
				$i++;
			}
			if (!feof($handle)) {
				print "Error: unexpected fgets() fail\n";
				die();
			}
			fclose($handle);
		}
		
		$this->tileSet = $this->generateMap($mapArray, $imageLocation);
		
		if($this->tileSet == null)
		{
			print "Unexpected error generating map.\n";
			die();
		}
		
	}
	
	protected function generateMap($mapset, $image) {
	
		//Generate map based on the mapArray
		
		$i = 0;
		
		foreach($mapset as $row)
		{
			//Current row in the mapArray
			
			foreach($row as $tile)
			{
				//Current tile in the mapArray
				
				$map[$i][] = "<img src=\"".$image."/".$tile.".png\" />";
			}
			
			$i++;
		}
		
		return $map;
	}
	
	public function showMap() {
	
		//Show the map
		
		
		if($this->tileSet != null)
		{
			
			
			$i = 0;
		
			foreach($this->tileSet as $row)
			{
				//Current row in the tileSet
				
				foreach($row as $tile)
				{
					//Current tile in the tileSet
					
					print $tile;
				}
				
				print "<br />";
				
				$i++;
			}
			
		}else{
			print "Tileset is empty.\n";
			die();
		}
	}

};

?>



Now that we've finished up our Map class, we need to put it to use. We can do so by creating a file called "map.php"--or whatever name you'd wish to call it:

<?php

include("classes/map.class.php");

$forest = new Map("areas/forest/map.map", "areas/forest/tiles");

print "Generating a basic mini-map...<br />";

$forest->showMap();


?>



This is what my file looks like. You can choose to name your Map object whatever you'd like, and you can use whatever map file and directory for your images that you'd like; the above example is just what I created.

The last thing that we need to do is create the actual map file, which can look something like so:

1,1,1,1,1,1,1,1,1,1,1,1
1,9,10,1,1,1,1,1,1,9,10,1
1,3,2,1,1,1,1,1,1,3,2,1
1,3,2,1,1,1,1,1,1,3,2,1
1,3,2,1,1,1,1,1,1,3,2,1
1,7,5,6,11,1,1,12,6,5,8,1



This is just an example of what a map file can look like. Please note that you don't have to use numbers for the tiles; that's just what I chose to use. An example of a map file using words instead of numbers is:

water,water,water,water,water,water
water,water,water,land,water,water
water,water,land,land,land,water,water
water,water,water,land,water,water,water
water,water,water,water,water,water



Conclusion

Congratulations, you've created a simple map generator! You can use this generator for whatever purposes you'd like; from displaying a mini-map for a game or just for fun; the possibilities are endless!

Thank you for reading this tutorial, and I hope that it benefits you in some way :).

Example of what I've created using this map generator:

Attached Image

Is This A Good Question/Topic? 2
  • +

Replies To: Simple RPG Map Generator

#2 bmamba  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 3
  • Joined: 14-April 12

Posted 14 April 2012 - 04:02 AM

Excellent tutorial, helps allot! :)

Question; how to make php editor for this maps?
Was This Post Helpful? 0
  • +
  • -

#3 nightscream  Icon User is offline

  • D.I.C Head

Reputation: 19
  • View blog
  • Posts: 237
  • Joined: 04-December 08

Posted 24 September 2012 - 11:39 AM

you can create a textarea where you can do the same as in a text file for example.

Of course you could make a jquery drag and drop gui too but that's a bit "more" complex
Was This Post Helpful? 0
  • +
  • -

#4 bmamba  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 3
  • Joined: 14-April 12

Posted 29 November 2012 - 01:56 AM

View Postnightscream, on 24 September 2012 - 11:39 AM, said:

you can create a textarea where you can do the same as in a text file for example.

Of course you could make a jquery drag and drop gui too but that's a bit "more" complex


Thanks for reply, yes, I know it can be done by textarea. I am experimenting this currently in my text editor.

I meant for "more" complex one.
If you know, just tutorial for "how to make" one will be fine.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1