# Applying Perlin Noise to Tiles

Playing with some Documentation about Perlin Noise I managed to create this map:

Nothing different from other Procedural Generated Maps. It is a HeightMap with colours at given heights.

The problem I am having with it is that this Colour Map it's in a single plane.

QUESTION

¿How can I draw the Perlin Noise Map in a plane made by a set of individual tiles?

The idea behind that question is that each tile will have a set of values such as population, water levels, soil quality, temperature and etc. I want to store things which can not be done on a simple single plane (according to my knowledge in this matter).

EDIT: Ok, after some more planning and research in the matter I did the next thing:

I have created a new class type named MapData.cs, this class will hold information about the heights, temperature, wetness and etc form the map as show below

MapData class

    public class MapData{

//The MapData class will hold different types of Data
//Temperature, Rainfall, etc.

public float[,] Data;
public float Min { get; set; }
public float Max { get; set; }

public MapData(int width, int height)
{
Data = new float[width, height];
Min = float.MinValue;
Max = float.MaxValue;
}

}


Then i will use that MapData class to put data into the tiles as show below:

Load Tiles function inside the Generator Class

void LoadTiles()
{
for (int x = 0; x < mapWidth; x++)
{
for (int y = 0; y < mapHeight; y++)
{
Tiles t = new Tiles();
t.X = x;
t.Y = y;

float heightValue = HeightData.Data[x, y];
heightValue = (heightValue - HeightData.Min) / (HeightData.Max - HeightData.Min);
t.HeightValue = heightValue;

if (heightValue < DeepWater)
{
t.HeightValue = DeepWater;
}
else if (heightValue < ShallowWater)
{
t.HeightValue = ShallowWater;
}
else if (heightValue < Sand)
{
t.HeightValue = Sand;
}
else if (heightValue < Grass)
{
t.HeightValue = Grass;
}
else if (heightValue < Forest)
{
t.HeightValue = Forest;
}
else if (heightValue < Mountain)
{
t.HeightValue = Mountain;
}
else { t.HeightValue = Snow; }
}
}


My actual problem here is that i am still confused with the Texture Generator as how do i apply this new concept into it. I am still learning and I do not want to mess up my progress.

Texture Generator

    public class TextureGenerator{

//Height Colours
private static Color DeepColor = new Color(15 / 255f, 30 / 255f, 80 / 255f, 1);
private static Color ShallowColor = new Color(15 / 255f, 40 / 255f, 90 / 255f, 1);
private static Color RiverColor = new Color(30 / 255f, 120 / 255f, 200 / 255f, 1);
private static Color SandColor = new Color(198 / 255f, 190 / 255f, 31 / 255f, 1);
private static Color GrassColor = new Color(50 / 255f, 220 / 255f, 20 / 255f, 1);
private static Color ForestColor = new Color(16 / 255f, 160 / 255f, 0, 1);
private static Color RockColor = new Color(0.5f, 0.5f, 0.5f, 1);
private static Color SnowColor = new Color(1, 1, 1, 1);

//This class will receive the colorMap array we set up before along with width and height

public static Texture2D TextureFromColourMap(Color[] colourMap, int width, int height)
{
//New texture object and apply that color code.
Texture2D texture = new Texture2D(width, height);
texture.filterMode = FilterMode.Point;
texture.wrapMode = TextureWrapMode.Clamp;
texture.SetPixels(colourMap);
texture.Apply();

return texture;
}

public static Texture2D TextureFromHeightMap (float[,] heightMap)
{
int width = heightMap.GetLength(0);//Grab the x from the heightMap array
int height = heightMap.GetLength(1);//Grabt the y from the heightMap array

Texture2D texture = new Texture2D(width, height);//New texture object

Color[] colourMap = new Color[width * height];//New colourMap object
for (int y = 0; y < height; y++)
{
for (int x = 0; x < width; x++)
{
//Gray scale colours for the NoiseMap
colourMap[y * width + x] = Color.Lerp(Color.black, Color.white, heightMap[x, y]);//Explained before in Noise Script
}
}

return TextureFromColourMap(colourMap, width, height);//Using the gray scale, coloursMap has colours in it!
}
}


I had inside the texture Generator some colour code for my initial tests for coloring the Perlin Noise over a plane. As you can see up in the image.

• Why would addressing a particular tile in your grid need to be fundamentally different from addressing a particular pixel on the texture plane? Feb 3, 2018 at 15:28
• 1) Yes, if you have enough texture channels 2) What I'm saying is if you know how to set something like MapPixel[x,y] = GenerateTerrainColourAt(x,y), can't you use effectively the same principles to set Tile[x,y].population = GeneratePopulationAt(x,y) or PopulationTiles[x,y] = ...? I'm trying to identify what specific kind of help you need moving from the generation you've done so far to your tile-based approach. Feb 3, 2018 at 15:35
• 10000 is not a big number as far as computers are concerned. You shouldn't encounter much difficulty with that. And yes, you can absolutely divide your map into chunks of any shape & configuration you want. Have you encountered a specific problem in making these divisions, that we might be able to help you with? Feb 3, 2018 at 15:49
• Sorry, I'm still having trouble understanding what problem you're trying to solve. Is it about creating a separate renderable object (like a quad or sprite) for each tile? Or associating properties to each tile in a grid, or applying chunked generation/loading to your map, or something else yet? Feb 3, 2018 at 16:07
• Yes indeed. We do this sometimes for G-buffers in deferred rendering, or when storing ambient, normal, occlusion, and sprcularity/smoothness/roughness maps for an object — each texture or each channel can carry different information about a given point in the 2D surface space. With this in mind, can you edit your question to elaborate on what you need help with to proceed to your next step? Feb 5, 2018 at 14:07

EUREKA!

Introduction

My initial question was about "How to Tiling with Perlin Noise"

I had in mind creating a plane with tiles (kind of a grid) [width * height] and on those tiles i will paint different textures. (That was kind of a brain fuck for me)

Initially i started with a plane and a texture material applied on it. It worked perfectly but i wanted some kind of way/ability to divide the map somehow in squares for purposes out of this question.

The result is the photo at the head of the question.

How i solved my problem?

Thanks to DMGregory and his infinite wisdom i started doing research and found out i could create multiple textures and apply them into the plane terrain AND i could access values the same way i access pixels to paint them.

Solution

I created a Data[,] container to store the random values generated,

MapData HeightData


then i "Tilled" them. How?

public void LoadTiles(MapData HeightData)


This load container which will help me display information gathered in the previous container into a texture using:

public static Texture2D GetHeightMapTexture(int width, int height, Tiles[,] tile)

And this is the result:

It is the same height map as i did before but this one code i remade helps me being more organized and it is expandable (easy to add more code without lose yourself and suffer depression)