cheikh.m.m.thiaw@aims-senegal.org

@Khadimskr·9 public vizzes

Fork of Radial Tree of Countries Hierarchy

This radial tree visualization shows the hierarchical structure of world countries, organized by continent and subregion, with each country as a leaf node. The circle-packing layout positions nodes radially, and the code uses `d3.hierarchy` and `d3.cluster` to compute the layout, with `d3.zoom` enabling pan and zoom interactions on the SVG. Link paths are generated manually via a projection function, and text labels adjust rotation and anchor based on depth and angle, with font size scaled by depth.

Dec 5, 2024

Loading thumbnail…

Fork of World Countries Tree

The World Countries Tree visualizes a hierarchical dataset of countries organized by continent and subregion as a labeled, zoomable tree diagram. It uses D3's `tree` layout and `linkHorizontal` path generator to draw curved links between nodes, rendering text labels whose font size decreases with depth. Implemented with D3 v5, the chart supports interactive pan and zoom through `d3.zoom`, with an SVG container and data loaded from a static JSON file.

Nov 21, 2024

Loading thumbnail…

Fork of RADIAL TREE 2

This radial tree visualization displays the hierarchical relationships between entities in a supply chain management system, organized by stages like Preplanting, Planting, Cultivation, Harvesting, and Storage. The data originates from a CSV file containing node IDs and values. The visualization uses D3.js v4’s tree layout with radial coordinates, rendering SVG paths for links and circles for nodes. Panning and zooming interactions are supported, allowing users to explore the hierarchy. Text labels are positioned and rotated based on each node’s angular position. The code imports D3 modules `select`, `json`, `hierarchy`, `linkHorizontal`, and `zoom`.

Nov 21, 2024

Loading thumbnail…

Fork of RADIAL TREE 2

A radial tree visualizes hierarchical workflow data from a CSV file, displaying agricultural phases from preplanting to processing. The visualization arranges nodes in a circular layout around a central root, with leaf nodes sized according to their associated values. The SVG rendering uses D3 v4's `d3.stratify` and `d3.tree` for hierarchical layout, with `d3.linkRadial` for curved links connecting parent and child nodes. Users can pan and zoom the interactive display.

Nov 21, 2024

Loading thumbnail…

Fork of RADIAL TREE 3

A radial tree visualization displays a hierarchical dataset of agricultural processes, from preplanting through storage and processing, with linked leaf nodes representing specific data items. The D3 v4 code uses `d3.stratify` and `d3.cluster` to compute the radial layout, rendering curved links via SVG paths and placing labeled nodes with circles. Interaction includes panning and zooming through `d3.zoom`. The visualization adapts Curran Kelleher’s world countries hierarchy block, using CSV data with pipe-delimited IDs to define parent-child relationships.

Nov 21, 2024

Loading thumbnail…

Fork of Radial Tree of Countries Hierarchy

This radial tree visualization displays a hierarchical dataset of world countries organized by continent and subregion. The graph uses curved links and rotated text labels to show the nested structure, with font size scaling by depth level. Built with D3 v4, it utilizes `d3.cluster`, `d3.hierarchy`, and `d3.zoom` for layout and interaction. Panning and zooming are enabled through the zoom module, which applies transformations to the SVG group. The data comes from a local `data.json` file containing the geographic hierarchy.

Nov 21, 2024

Loading thumbnail…

Fork of RADIAL TREE 2

This is a fork of the RADIAL TREE 2 visualization that displays a hierarchical dataset of agricultural data as a radial tree. The tree branches from a central root, with nodes representing categories like Preplanting, Planting, Cultivation, Harvesting, and Storage, and leaf nodes showing specific data types. The code uses d3.stratify to build the hierarchy from a CSV file, d3.tree for layout, and d3.linkRadial to draw curved links. Users can pan and zoom the SVG rendering, with node labels rotated along the circular structure.

Nov 21, 2024

Loading thumbnail…

Fork of RADIAL TREE 2

A fork of Curran Kelleher’s World Countries Hierarchy block, this radial tree visualization displays the hierarchical structure of the Flare dataset, with each node labeled and leaves as small circles. Built with D3 v4, it uses `d3.tree()` with a radial size, renders SVG paths for links, and supports panning and zooming. The code employs `d3.csv` to load the data, `d3.hierarchy` to construct the tree, and `d3.linkHorizontal` with a custom `radialPoint` function for positioning, with node labels automatically rotated and anchored based on their angle.

Nov 21, 2024

Loading thumbnail…

Fork of Radial Tree of Countries Hierarchy

This example presents a radial tree visualization of a “Supply Chain” hierarchy, depicting a branching structure of agricultural roles and data types. The visualization uses circular, ring-like node placement with connecting curved links and labeled nodes. Panning and zooming are supported for interactive exploration. The implementation uses d3.cluster with d3.hierarchy for data structuring, d3.linkRadial for the path shapes, and SVG transforms to position circles and text labels. The code highlights the D3.js v6 API, which manages the layout and drawing within a single SVG canvas.

Nov 20, 2024