Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Blank Slate with Hot Reloading

Public visualization

Viewing a saved revision (read-only)

280c2c9b54a04ab2b27612891b5a216b

Fork of Blank Slate with Hot Reloading

0 stars0🌍 Public
NNita
Last edited Mar 3, 2025
Created on Mar 2, 2025

This dashboard for a school's 2025 forecasted performance combines multiple interactive D3.js visualizations into one screen. It shows key statistics, a pie chart of subject performance, a bar chart of average grades by class, and an interactive piano that maps subjects to musical keys with color intensity reflecting grades. A schematic school floor plan positions classes using circle sizes for student population. The code uses D3's `rollup`, `scaleBand`, `scaleLinear`, `scaleOrdinal`, `pie`, `arc`, and TopoJSON for rendering.

AI-generated description

Ice Cream Truck Sales Analysis (2025 Forecast)

This visualization presents a forecasted analysis of ice cream truck sales across various locations in the United States for the year 2025. The dashboard offers multiple visualizations to help identify sales patterns and insights.

Visualizations Included

  1. Key Statistics Panel: Provides an overview of total sales, total ice creams sold, and the most popular flavors and trucks.

  2. Flavor Sales Distribution: A pie chart breaking down the sales distribution across different ice cream flavors.

  3. Sales by Truck: A bar chart showcasing which ice cream trucks achieved the highest sales.

  4. Ice Cream Truck Locations: A map visualization displaying the geographical distribution of ice cream trucks, with circle sizes indicating sales volume.

Data Notes

This visualization uses forecasted data for 2025 and is intended for demonstration purposes only. In a real-world scenario, this would be populated with actual sales and location data.

How to Use

  • Hover over chart elements to see more details.
  • The map visualization provides tooltips with detailed information about each truck's sales performance.
  • Analyze patterns across different flavors and truck locations.

Technologies Used

  • D3.js for interactive visualizations
  • JavaScript ES6
  • TopoJSON for map rendering
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/bZhWCO-bDek?si=ZjfT29wTiZAdT3aW" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-wri

Full course playlist: YouTube: Constructing Visualization 2024.