GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • Sign in
  • ActionsCI/CD and automation
  • CodespacesCloud development environments
  • All Features
  • Documentation
  • Training
  • Certifications
  • Build with Copilot
  • Customize Copilot
  • Integrations
  • Trending repos
  • GitHub Sponsors
  • Developer articles
  • Enterprises

This view

  • Original page
  • New address

GeezerVison is showing github.com — GitHub - algorithm-visualizer/tracers.js: :scroll:Visualization Library for JavaScript

BranchesTags
Open more actions menu

Latest commit

 

History

95 Commits
95 Commits

Folders and files

NameName
Last commit message
Last commit date
src
src
 
 
test
test
 
 
.gitignore
.gitignore
 
 
.travis.yml
.travis.yml
 
 
LICENSE
LICENSE
 
 
README.md
README.md
 
 
package-lock.json
package-lock.json
 
 
package.json
package.json
 
 
rollup.config.js
rollup.config.js
 
 
tsconfig.json
tsconfig.json
 
 
typedoc.json
typedoc.json
 
 

Repository files navigation

tracers.js npm API reference Travis (.com)

This repository is part of the project Algorithm Visualizer.

tracers.js is a visualization library for JavaScript. You can use it on algorithm-visualizer.org or locally on your machine.

Installation

npm install algorithm-visualizer

Usage

// import visualization libraries {
const { Array2DTracer, Layout, LogTracer, Tracer, VerticalLayout } = require('algorithm-visualizer');
// }

// define tracer variables {
const array2dTracer = new Array2DTracer('Grid');
const logTracer = new LogTracer('Console');
// }

// define input variables
const messages = [
  'Visualize',
  'your',
  'own',
  'code',
  'here!',
];

// highlight each line of messages recursively
function highlight(line) {
  if (line >= messages.length) return;
  const message = messages[line];
  // visualize {
  logTracer.println(message);
  array2dTracer.selectRow(line, 0, message.length - 1);
  Tracer.delay();
  array2dTracer.deselectRow(line, 0, message.length - 1);
  // }
  highlight(line + 1);
}

(function main() {
  // visualize {
  Layout.setRoot(new VerticalLayout([array2dTracer, logTracer]));
  array2dTracer.set(messages);
  Tracer.delay();
  // }
  highlight(0);
})();

Check out the API reference for more information.

Contributing

Check out the contributing guidelines.

About

📜Visualization Library for JavaScript

algorithm-visualizer.org/

Topics

visualization-library

Resources

Readme
MIT license
Activity
Custom properties

Stars

79 stars

Watchers

4 watching

Forks

33 forks
Report repository

Releases

Packages

Used by

Contributors

Languages

You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.