Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/syamreddy99/datavisualazation

A data visualization dashboard designed to provide interactive and insightful visualizations using data from `Data.csv`. Built with a Java Spring Boot backend and React.js frontend, this project showcases various metrics such as intensity, likelihood, relevance, and more, with dynamic filters and charts for in-depth data analysis.
https://github.com/syamreddy99/datavisualazation

backend backenddevelopment datavisualization-project java mysql rest-api spring springboot

Last synced: 7 days ago
JSON representation

Host: GitHub
URL: https://github.com/syamreddy99/datavisualazation
Owner: syamreddy99
Created: 2024-07-10T07:59:29.000Z (4 months ago)
Default Branch: main
Last Pushed: 2024-07-29T06:20:54.000Z (4 months ago)
Last Synced: 2024-07-29T07:39:41.424Z (4 months ago)
Topics: backend, backenddevelopment, datavisualization-project, java, mysql, rest-api, spring, springboot
Language: Java
Homepage: https://datavisualazation.vercel.app
Size: 26.4 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        # 🎨 Visualization Dashboard Test Assignment

## 📚 Overview

Welcome to the Visualization Dashboard Test Assignment! This project involves creating an interactive data visualization dashboard using data from `Data.csv`. Developed with Java for the backend and React.js for the frontend, the dashboard provides an engaging interface for exploring and analyzing data.

## 🎯 Objective

The goal of this assignment is to build a data visualization dashboard that displays metrics such as intensity, likelihood, relevance, year, country, topics, region, and city. The dashboard includes various filters to refine data analysis.

## 📊 Data

The data used in this project is available in the `Data.csv` file. You can download it from the following link:

[📂 Download Data.csv](https://drive.google.com/file/d/1fhnb4QYyvOFKMfVfqE-yvvCGBRNWiCzO/view?usp=drive_link)

![Data Visualization](https://github.com/syamreddy99/Dynamic-webpage-images-/blob/main/Screenshot%20(37).png?raw=true)  

*Sample Data Visualization*

## 🛠 Technologies & Tools

### **Programming**

- **Java** ![Java](https://img.shields.io/badge/-Java-007396?style=flat&logo=java&logoColor=white)

  

### **Web Development**

- **HTML5** ![HTML5](https://img.shields.io/badge/-HTML5-E34F26?style=flat&logo=html5&logoColor=white)

- **CSS3** ![CSS3](https://img.shields.io/badge/-CSS3-1572B6?style=flat&logo=css3&logoColor=white)

- **JavaScript** ![JavaScript](https://img.shields.io/badge/-JavaScript-F7DF1E?style=flat&logo=javascript&logoColor=black)

- **Bootstrap** ![Bootstrap](https://img.shields.io/badge/-Bootstrap-563D7C?style=flat&logo=bootstrap&logoColor=white)

### **Database & Connectivity**

- **MySQL** ![MySQL](https://img.shields.io/badge/-MySQL-4479A1?style=flat&logo=mysql&logoColor=white)

- **JDBC** ![JDBC](https://img.shields.io/badge/-JDBC-007396?style=flat&logo=jdbc&logoColor=white)

### **Frameworks**

- **Spring** ![Spring](https://img.shields.io/badge/-Spring-6DB33F?style=flat&logo=spring&logoColor=white)

- **Spring Boot** ![SpringBoot](https://img.shields.io/badge/-SpringBoot-6DB33F?style=flat&logo=springboot&logoColor=white)

### **Visualization Libraries**

- **D3.js** ![D3.js](https://img.shields.io/badge/-D3.js-F9A03C?style=flat&logo=d3-dot-js&logoColor=white)

- **Chart.js** ![Chart.js](https://img.shields.io/badge/-Chart.js-F7DF1E?style=flat&logo=chart-dot-js&logoColor=black)

- **FusionCharts** ![FusionCharts](https://img.shields.io/badge/-FusionCharts-FF9F00?style=flat&logo=fusioncharts&logoColor=white)

- **Plotly.js** ![Plotly.js](https://img.shields.io/badge/-Plotly.js-3D4D6C?style=flat&logo=plotly&logoColor=white)

- **Google Charts** ![Google Charts](https://img.shields.io/badge/-Google%20Charts-4285F4?style=flat&logo=google-charts&logoColor=white)

- **Highcharts** ![Highcharts](https://img.shields.io/badge/-Highcharts-1F77B4?style=flat&logo=highcharts&logoColor=white)

## 🚀 Key Features

- Interactive graphs, charts, and visuals.

- Filters for end year, topics, sector, region, PEST, source, SWOT, country, and city.

- Customizable and creative visualizations.

- Data is fetched from the database using a Java/Spring Boot API.

## ⚙️ Installation and Setup

## 1️⃣ Clone the Repository

### Clone the repository to your local machine:

     ````bash

     git clone https://github.com/yourusername/visualization-dashboard.git

# 2️⃣ Backend Setup

### Navigate to the backend directory:

    ````bash

    cd backend

### Configure the database connection in the application.properties file.

### Build and run the Spring Boot application:

    ````bash

    mvn clean install

    mvn spring-boot:run

### The backend server will be available at http://localhost:8080.

# 3️⃣ Frontend Setup

### Navigate to the frontend directory:

    ````bash

    cd frontend

# Install the necessary dependencies:

    ````bash

    npm install

# Start the frontend server:

    ````bash

    npm start

## The frontend will be accessible at http://localhost:3000.

# 💾 Data Loading

### Import the Data.csv file into your chosen database.

### Ensure the database schema aligns with the data structure for smooth integration with the backend.

# 🖥 Usage

### Open http://localhost:3000 in your browser.

### Explore the dashboard to visualize various metrics and data.

###  Apply filters to refine and analyze the data based on your criteria.

# 🔍 Examples

### Check out these example dashboards for inspiration:

### Dashboard Example 1

### Dashboard Example 2

### Dashboard Example 3

# 📬 Contact

### For any questions or issues, please reach out to [email protected]