Visual-Analytics-Project Svelte Themes

Visual Analytics Project

An interactive data visualization dashboard built with Svelte and D3.js, using the Superstore Sales Dataset. This project showcases dynamic, data-driven visualizations with features like hover effects, region-based filtering, and linked views, all wrapped in a clean and intuitive UI.

📊 Superstore Sales Dashboard

An Interactive Visual Analytics Dashboard built using Svelte and D3.js, leveraging the Superstore Sales Dataset to deliver insightful business analytics through rich, dynamic visualizations.

Developed as part of a Master's course at RPTU Kaiserslautern-Landau (Oct 2024 – Feb 2025), this project showcases practical applications of visual analytics, data visualization, frontend development, and user-centered design.


🚀 Project Overview

This web-based dashboard provides key business insights using interactive charts and visual storytelling techniques. It enables users to explore regional, categorical, and temporal sales patterns, uncover trends, and make informed decisions through a seamless interface.


🔍 Features

  • Interactive Charts – Hover effects, region-based filtering, and linked views
  • Custom Data-Driven Visualizations – Beyond basic plots for deeper insights
  • Clean UI/UX – Modern design for seamless navigation and user experience
  • Effective Storytelling – Data used meaningfully to narrate business performance
  • Multi-Page Dashboard -
    • Overview: Provides a high-level view of business performance.
    • Detailed Pages: Dive deeper into specific aspects with pages for Sales & Profit, Product Performance, Shipping Efficiency, and Executive Summary.

💻 Tech Stack

  • Svelte: For reactive UI development.
  • D3.js: Utilized for creating custom, high-performance data visualizations.
  • JavaScript / HTML / CSS: Applied for frontend logic and styling

Dataset: Superstore Sales Dataset


🛠️ Setup & Development

1. Clone the repository

git clone https://github.com/your-username/visual-analytics-project.git
cd visual-analytics-project

2. Install dependencies

npm install

3. Start the development server

npm run dev
# or open directly in browser
npm run dev -- --open

4. Build for production

npm run build

5. Preview production build

npm run preview

📈 Dataset

The project leverages the Superstore Sales Dataset, containing detailed records on orders, products, regions, categories, sales, and profits. It serves as a rich source for uncovering business trends and practicing visual analytics techniques.

📚 Learning Outcomes

This project helped me strengthen skills in:

  • 📊 Interactive data visualization.

  • 💻 Frontend development with Svelte.

  • 🧠 Designing for intuitive user experience.

  • 🗣️ Storytelling through data insights.

📎 License

This project is for educational and demonstration purposes as part of coursework. If you'd like to use or extend it, please feel free to reach out.

✨ Acknowledgments

Course: Visual Analytics Project @ RPTU Kaiserslautern-Landau

Supervisor: Jan-Tobias Sohns

Dataset: Provided by Rohit Sahoo

👋 Let's Connect!

If you find this project useful or want to talk about data visualization and frontend analytics, feel free to connect with me on LinkedIn!

Top categories

Loading Svelte Themes