Create a grid on the floor

I looked a lot for a solution like this, but I didn’t find it. After much research and chats, I created a function that facilitates the creation of grids to be placed on the floor, for example, in creative games where the player wants to position an object inside a grid using a specific snap.


Here the grid decal I created in Photoshop:
grade

Here the script:

function CreateGrid(gridSizeX, gridSizeZ, gridPartDiameter, gridStartPosX, gridStartPosZ)
	local gridFolder = Instance.new("Folder", workspace) -- to store all created grid blocks
	gridFolder.Name = "GridFolder"

	for x = gridStartPosX, (gridSizeX + 1) * gridPartDiameter, gridPartDiameter do
		for z = gridStartPosZ, -gridSizeZ * gridPartDiameter, -gridPartDiameter do
			-- create a new gridPart instance
			local gridPart = Instance.new("Part", gridFolder) -- create the a grid part inside the gridFolder
			gridPart.Size = Vector3.new(gridPartDiameter, 1, gridPartDiameter) -- the grid part will be a square
			gridPart.Transparency = 1 -- hide the part
			gridPart.Anchored = true
			gridPart.CanCollide = false
			gridPart.Name = string.format("%0.3i", x).."_"..string.format("%0.3i", z).."_grid" -- (not necessary) name the gridPart 
			gridPart.Position = Vector3.new(x, -0.5, z) -- position the grid under the ground (BasePlate)

			-- create a Decal for gridPart
			local gridDecal = Instance.new("Decal", gridPart) -- the decal image to be on the top of the gridPart
			gridDecal.Texture = "rbxassetid://5095516829" -- my grid image (can be anything)
			gridDecal.Face = "Top" -- put the decal image on top of the gridPart
		end
	end
end
-------------------------- Here you put your parameters ----------------
local SIZE_X = 3 -- width of the grid
local SIZE_Z = 6 -- depth/lenght of the grid
local PART_DIAMETER = 3 -- size of each grid block
local START_POS_X = 5 -- start position of the grid in the 3D scene
local START_POS_Z = -3

CreateGrid(SIZE_X, SIZE_Z, PART_DIAMETER, START_POS_X, START_POS_Z) -- create the grid

With the parameters of the example above, a grid of 6x3 blocks will be created, with initial position 5, -3, with each block having a width and length of 3 studs:

32 Likes

This is perfect for the game I am making! Thank you!

1 Like

It’s super cool, I know it’s just a open source “snippet” of code, but if you ever wanted to advance it, adding “tweening capabilities” where the grid is generated through an “animation” would be really cool to see.

2 Likes

WOW! You should have worked a lot for making this thing, i rlly like it! Of course, you can also make a feature that can change the decal color. Maybe you can use the decal Color3 to make this!

1 Like

Can’t you just use a texture instead?

4 Likes

Textures fill the entire face, this allows you to fill a small portion of it customly.

No, that’s what a decal does, this is a texture:

3 Likes

Yes, that it was I’m talking about. It fills the entirety of the selected face with the texture, not just a portion of it (Like this one does).

It is so much more efficient, in the resource, you have to create parts and attach decals on it, which will take up a lot of memory, in addition, you can just do this:

Which utilizes only 2 parts.

4 Likes

Yeah I guess but I think with this script it’ll allow you to like have a snap to grid action because of the each individual parts that are there (sorry if I’m wrong)

You can also use attachments as placeholders or use some simple math to clamp the positions:

math.clamp(postion.X, something)
math.clamp(Position.Z, something)

or

math.ceil

or

math.floor
2 Likes

Well then I mean, if you use textures I don’t think you can like expand the grid and add the attachments without it being a pain through scripts and also just attaching attachments to each one of the grid slots would be painstakingly annoying.

1 Like

I don’t think you get what I’m saying, you can expand the texture by changing the part size.

That’s where the math comes in. Ever seen a placement system in Bloxburg or in threads on the forum? Most of them use simple math, which is so much less tedious.

4 Likes

Yea that’s a good point actually :joy:

1 Like

I redid the code so it would work with a texture:

local function CreateGrid(gridSizeX, gridSizeZ, gridPartDiameter, gridStartPosX, gridStartPosZ)
	local gridPart = Instance.new("Part")
		gridPart.Size = Vector3.new(
			gridSizeX * gridPartDiameter, 
			1, 
			gridSizeZ * gridPartDiameter
		)
		gridPart.Transparency = 1
		gridPart.Anchored = true
		gridPart.CanCollide = false
		gridPart.Position = Vector3.new(
			gridStartPosX + gridPartDiameter * (gridSizeX/2 - 0.5), 
			-0.5, 
			gridStartPosZ - gridPartDiameter * (gridSizeZ/2 - 0.5)
		)

		local gridTexture = Instance.new("Texture")
			gridTexture.Texture = "rbxassetid://5095516829"
			gridTexture.Face = Enum.NormalId.Top
			gridTexture.StudsPerTileU = gridPartDiameter
			gridTexture.StudsPerTileV = gridPartDiameter
			gridTexture.Parent = gridPart

		gridPart.Parent = workspace
end

-- Part parameters
local SIZE_X = 3 -- width of the grid
local SIZE_Z = 6 -- depth/lenght of the grid
local PART_DIAMETER = 3 -- size of each grid block
local START_POS_X = 5 -- start position of the grid in the 3D scene
local START_POS_Z = -3

CreateGrid(SIZE_X, SIZE_Z, PART_DIAMETER, START_POS_X, START_POS_Z) -- create the grid

I don’t know if it conforms to the old grid in every way, but it at least conforms to the variables the OP provided.

Edit: I played around with the variables in both versions, the old script actually lies about its size if you put position variables much larger or smaller than the size variables. This is because the for loops only offset the starting point, not the ending point.

5 Likes

i think if someone dosent know how to use a texture (which idk why xd) he can use this code, it may be kinda laggy, but it can be used just for testing, or maybe for building. also its a way to practice code, it dont be obligatory useful for something! sometimes we just make code or building to practice, and thats very nice to see, this guy known that he was able to make something with scripts and he made it. It may be useless because u can use a texture, but its good to see anyone putting effort on practicing coding, also, its very cool ngl. theres always more than 1 way to do something!

1 Like

Thank you @goldenstein64.
Indeed I’m still learning and I started to create this script using textures, but when I saw that textures were not adapting to the part size, I changed to Decal.
Your version with textures seems to be much more efficient and also will teach many people.
Thank you! :+1:

3 Likes

How would you generate something like that but without creating parts and just storing positions (spacial partioning i think) so like using the part to create a bunch of positions that create a sort of grid

I just use BetterBaseplate for a grid

How would I make the grid size/position to a part correctly.

To a part like this: