amorenos25

@amorenos25·3 public vizzes

Untitled

This is an interactive, animated tree diagram that visualizes a classification decision path, starting from a root node labeled "Root" and branching through binary decisions on features (e.g., "feature 434 <= 0.0") to leaf nodes that predict a class of 0.0 or 1.0. The visualization, built with D3.js (version 3.5.16), uses the `d3.layout.tree` and `d3.svg.diagonal` APIs to position and draw the hierarchical links, with nodes that can be clicked to expand or collapse their children. The data is loaded from a JSON file (`structure.json`), and the entire scene supports smooth transitions over 750 milliseconds.

Aug 3, 2022

Loading thumbnail…

A

This interactive tree visualization displays hierarchical data from a JSON file using D3.js v5 and React. The visualization presents nodes as colored circles—green for parent nodes and red for leaf nodes—connected by animated horizontal links. Users can click on circles to collapse or expand subtrees, with smooth transitions updating the layout. The implementation uses d3.hierarchy, d3.tree, and d3.linkHorizontal for position calculations, while SVG elements and CSS transitions handle the rendering and animation effects.

Aug 2, 2022

Loading thumbnail…

Fork of World Countries Tree

This example visualizes a decision tree from JSON data, using a horizontal icicle layout to show the hierarchy of classification rules and their predicted outcomes. The visualization employs D3.js v5 APIs including `tree`, `hierarchy`, and `linkHorizontal` to compute the layout and draw the connecting links as SVG paths. Zooming and panning functionality is implemented through the `zoom` event, which applies an SVG transform to the main group. The tree’s branching nodes display the split conditions, while leaf nodes show numeric prediction values, all rendered with a custom Playfair Display font.

Aug 2, 2022