Nutmeg Pumpkin Macchiato

    TypeScript icon, indicating that this package has built-in type declarations

    0.0.6 • Public • Published

    HTML Decision Tree

    This is a generic library for building a simple web-based decision trees UI. Data is provided in JSON format, which is then displayed on a website.

    Installing and Building

    The code is in Typescript. After cloning the repository, just type

    npm install
    npm run-script build

    This builds the decisiontree.js library in dist.

    Alternative build is done using typescript and webpack:

    npx tsc
    npx webpack

    Or simply install the package using

    npm install html-decision-tree

    Simple Example

    Here is a very simple decision tree for deciding if you should play tennis:

    Tennis example

    Here is the corresponding flow chart decision tree for deciding if you should play tennis in SVG

    Alt Tennis Decision Tree

    and in JSON format.

    JSON Format

    Current node format in some pseudo grammar:

    type: binary|nary|null,
    value: 0-9+,
    title: \w*,
    content: \w*,
    labels: [{
      text: \w*,
      value: 0-9+,
    children: [node*],
    action: URL

    The idea is nary nodes have content (that is the description on the radio button) which is linked via the value to the children . Binary nodes have default description content as Yes (0) and No (1). Actions are only considered in leaf nodes and open a new Tab.


    • Amaya Webster for suggesting the initial idea at the 2020 DIAGRAM and ETS Code Sprint
    • Brian Hochhalter for UI design and wireframe design and prototyping
    • Danielle Vargas for CSS styles and accessibility testing and design
    • Carlos Cavalie for accessibility testing and design


    npm i html-decision-tree

    DownloadsWeekly Downloads






    Unpacked Size

    137 kB

    Total Files


    Last publish


    • zorkow