Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Custom Color TreeMap

Public visualization

Viewing a saved revision (read-only)

26c9a71e875e40778e9a03a1a5eff68f

Fork of Custom Color TreeMap

0 stars0🌍 Public
GGayan Priyadarshana
Last edited Aug 18, 2023
Created on Aug 18, 2023

This interactive treemap visualizes steel scrap exports from the United States to various partner countries, with each colored rectangle representing a country and its total export value. The visualization uses d3.hierarchy and d3.treemap to compute the layout, with a sequential color scale interpolating from lightblue to darkblue based on value magnitude. Users can click any country cell to drill down into its commodity-level breakdown, while a reset button restores the original country-level view. The code employs D3 v7's data joins and transition methods to smoothly animate between hierarchy levels, with SVG rendering for all elements.

AI-generated description