What data formats are supported?

The tool supports hierarchical data provided as a JSON object or a text-based format using 'parent:child:value' syntax.

Can I change the shape of the nodes?

Yes, you can choose from circle, rectangle, rounded rectangle, or diamond shapes in the settings.

Is the generated diagram interactive?

Yes, the tool generates an interactive HTML-based tree diagram that allows for clear navigation of hierarchical data.

Can I hide the numeric values on the nodes?

Yes, you can toggle the 'Show Node Values' checkbox to display or hide numeric data associated with each node.

What is the maximum chart height I can set?

You can adjust the chart height between 300 and 1200 pixels to accommodate your specific layout needs.

Elysia Tools

Navigation

Data Visualization

Tree Diagram Generator

Generate interactive tree diagrams from hierarchical data with customizable styling

Execution

Run this tool

Fill in the form, run the tool, and review the result in one place.

Inputs

Options are grouped so long tools stay easier to scan.

13 options

ContentPaste or type the main input values.2

Tree DatatextareaRequiredHierarchical data for the tree. Supports JSON object or parent:child:value text formatChart TitletextOptionalTitle that will be displayed above the chart

SettingsAdjust formats, ranges, numbers, and modes.9

Node ShapeselectOptionalNode ColorcolorOptionalColor for the tree nodesNode Text ColorcolorOptionalColor for the node textLine ColorcolorOptionalColor for the connecting linesBackground ColorcolorOptionalBackground color for the chart containerNode SizenumberOptionalSize of nodes in pixelsFont SizenumberOptionalFont size for node textLine WidthnumberOptionalWidth of connecting linesChart HeightnumberOptionalHeight of the chart in pixels

TogglesEnable or disable optional behavior.2

Show Node LabelscheckboxOptionalEnabled when checkedDisplay text labels on nodesShow Node ValuescheckboxOptionalEnabled when checkedDisplay numeric values on nodes

Result

Ready for a run

Run the tool to preview files, text, structured data, or streamed output here.

Samples

Tree Diagram Generator

Run this tool

Inputs

Result

Examples that match this tool

Continue with connected tools and hubs

Inputs

Result

Learn when to use this tool, what it supports, and how real users apply it.

Key facts

Overview

When to use

How it works

Use cases

Examples

1. Corporate Organizational Chart

2. Decision Tree Visualization

FAQ

QR Code Samples

ELK Stack Log Analysis Samples

Grafana Advanced Application Samples

Distributed Tracing Samples

Donut Chart Generator

Funnel Chart Generator

Pictograph Generator

Progress Bar Generator

JSON Interchange and Format Translation Tools

Text Case, Encoding, and Normalization Conversion Tools

JSON Inspection, Diff, and Transformation Tools

Text Tools