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)

b9f354e52a5748c8bfc8a44aba0472b9

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