Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Tree Visualization

Public visualization

Viewing a saved revision (read-only)

10b696dbc5824cf88b4eb517e354bc72

Tree Visualization

0 stars0🌍 Public
UUVarshaReddy
Last edited Jul 22, 2023
Created on Jul 22, 2023
Forked from Hello VizHub

This example displays a static, hierarchical tree layout with the root node "WEATHER" branching into three seasonal categories, each with three child nodes. It uses the D3.js v5 library with a `d3.tree()` layout and custom aggregation via `d3.hierarchy()` to structure the data. The visualization renders as SVG, applying distinct fill colors and geometric shapes (circles, rectangles, and ellipses) to each tree depth, with curved links drawn as SVG paths using cubic Bézier commands. Node labels are positioned dynamically based on whether they have children.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.