Wondering what’s next for npm?Check out our public roadmap! »


    3.0.1 • Public • Published

    Text Maze

    Create mazes with paths in the form of lines of text.

    Use text-maze-render to render a text maze in a browser via the HTML Canvas API.

    See it in use: https://littlesystem.com/maze


    Each maze is a 2D array. The value at each index in the nested arrays is a number indicating the type of location in the maze. The solution path follows negative values through the maze.

    • 2 A path and part of the embedded text.
    • 1 A path but not part of the embedded text.
    • 0 Not a path.
    • -1 As 1, but also on the solution path.
    • -2 As 2, but also on the solution path.

    Current character whitelist for text:

    abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789 .?!'


    npm install --save text-maze


    • width Optional maze width. An array length. The maze is auto-sized for the browser when width is not given.
    • margin Optional margin in pixels. Used when auto-sizing, ignored when width is given. The following default margin values are used for auto-sizing when margin is not given: 30px for screens < 576px, 100px otherwise.


    Import text-maze.

    var tm = require('text-maze');

    Create an auto-sized maze.

    var maze = tm.init('the text you want embedded in the maze').maze;

    Get the auto-size values for use with the text-maze-render package.

    var result    = tm.init('Scooby Dooby Doo');
    var maze      = result.maze;      // The maze.
    var endpoints = result.endpoints; // Know your endpoint coordinates.
    var cellSize  = result.cellSize;  // Render each maze location in a cellSize × cellSize square.

    Create a maze of width 100. The cellSize property in the returned object will be null.

    var maze = tm.init('Where are you?', { width: 100 }).maze;

    Create a maze auto-sized for the screen leaving 200 pixels of margin.

    var maze = tm.init("We've got some work to do now.", { margin: 200 }).maze;

    For use in a browser, bundle your code with something like browserify.

    browserify code.js -o bundle.js


    npm i text-maze

    DownloadsWeekly Downloads






    Last publish


    • avatar