Send Close Add comments: (status displays here)
Got it!  This site "robinsnyder.com" uses cookies. You consent to this by clicking on "Got it!" or by continuing to use this website.  Note: This appears on each machine/browser from which this site is accessed.
Lua: Maze generation with static SVG
by RS  admin@robinsnyder.com : 1024 x 640


1. Lua: Maze generation with static SVG
This page uses statically generated SVG (Scalable Vector Graphics) for recursive maze generation.

2. Recursive maze generation and visualization
Here are links to a series on recursive maze generation and visualization (more coming)
I have been experimenting with SVG as used in, say D3, for visualization graphics for data science applications.

This SVG has not yet been integrated into the system used for scaling for various devices screens.

3. CSS for SVG
Here is the CSS used for the SVG examples (on this page).

The rmsSvg is for all SVG images (on this page) and puts a obvious border around the SVG for demonstration purposes.

The rmsLine style is used for the lines in the maze. Here is the Lua code [#1]


4. A 24x16 maze as an image
Maze 15Here is an example 24x16 maze as a GIF (Graphics Interchange Format) image from Maze algorithm explanation using GIF images .

One is to enter at the upper left at the in-arrow and exit at the lower right at the out-arrow without crossing any lines.

A smaller 12x8 maze as SVG is now developed, without the arrows, to show the method using programming. In this case, off-line Lua code was used to generate the SVG for the maze. The body of the SVG code here is statically generated by Lua code (below).

Here is the SVG code [#1]

Here is how the SVG code appears.

Lua code was used to create the SVG for the lines that appears above.

The Lua code is below.

5. Algorithm pesudo-code
Here is a pseudo-code for the maze generation algorithm as described to make a maze of rows and columns.
Main: Start with an empty canvas. Outline the maze limits with an entry and exit point on opposite sides. Call MazeGenerate with the rows and columns to be filled in. MazeGenerate: If the rows and columns requested are both greater than 1 Then If the height is greater than the width Then Divide the grid into top and bottom parts. Draw a (horizontal) line between the parts, leaving a gap to pass through. Call MazeGenerate on the top part Call MazeGenerate on the bottom part Else Divide the grid into left and right parts. Draw a (vertical) line between the parts, leaving a gap to pass through. Call MazeGenerate on the left part Call MazeGenerate on the right part End If End If

The actual code fills in details that are not needed at the higher level of the algorithm description. For example, the side and gap lengths, and exact x and y coordinates are omitted. As another example, the division into parts can be done using pseudo-random numbers, but that is omitted from the algorithm.

For more information, see the following: Maze algorithm explanation using GIF images Here is the Lua code used to generate the SVG.


6. Code notes
... more to be added ... Here is the output of the SVG code.

This output of the Lua code was used in the SVG above.

This is a fairly static way of generating a maze. Generating the SVG with JavaScript facilitates dynamic interaction with the created SVG. This is the next step.

... more to be added ...

7. End of page

by RS  admin@robinsnyder.com : 1024 x 640