Post main image

Tree Map Diagram

Tree Map Diagram using JSON Data (e.g. Movie Sales)

User profile image
9 days ago
#6 Project of the Week

The aim of this project is to visualize data with a treemap diagram using JSON Data. This project uses JSON Data for movie sales. The JSON Data is at https://cdn.freecodecamp.org/testable-projects-fcc/data/tree_map/movie-data.json. Fields - Name, Category and Value. Category consists of Action, Drama, Adventure, Family, Action, Comedy and Biography. If category is Action, set the color to orange. If category is Drama, set the color to yellow. If category is Adventure, set the color to lightblue. If category is Family, set the color to lightgreen. If category is Animation, set the color to lawngreen. If category is Comedy, set the color to darkseagreen. If category is Biography, set the color to pink. When mousing over the area, the fill color changes to lavender and the tooltip is displayed. The tooltip gives information about the value and name of the movie. For example, $ 380,838,870 (Value) and Finding Nemo (Name).

Screenshots
Project screenshot 1
Project screenshot 2
Project screenshot 3
Project screenshot 4
Project screenshot 5
Project screenshot 6
Project screenshot 7
Project screenshot 8
0
445

Skip straight to final coding interviews with
Remote Companies!

CK Projects Rewards

1. Get feedback on your portfolio projects from fellow techies and makers.

2. Free 3 months subscription to Crash to pitch top companies.

3. Access Career Karma Hiring Assessment powered by Triplebyte to introduce top bootcamp students to remote friendly tech companies.

4. Portfolio Projects Masterclass Workshops.

Top Makers