Tool

BI Analytics Dashboard Prototype

A BI dashboard prototype that turns uploaded Excel data into KPI panels, charts, and a draggable dashboard canvas, built as reference source code rather than a hosted demo.

BI analytics dashboard illustration with KPI panels, chart canvas, and data model controls

This page links a public repository, Mavline/PowerBI_like, for business-dashboard work. The repository is a client-side prototype that turns Excel data into dashboard elements.

What the source code shows

The dashboard state is modelled with explicit types rather than loose objects. The store enumerates the supported chart types and maps spreadsheet columns to chart roles, which is the reusable core of the prototype:

// src/store/dashboardStore.ts (sanitized excerpt)
export type ChartType =
  | 'bar' | 'line' | 'column'
  | 'stackedBar' | 'stackedColumn'
  | 'pie' | 'donut' | 'treemap' | 'table';

export interface ChartFields {
  xAxis?: string;
  yAxis?: string;
  category?: string;
  values?: string;
  series?: string;
  columns?: string;
}

export interface DashboardItem {
  id: string;
  type: ChartType;
  title: string;
  // position and size drive the draggable canvas layout
}

How this maps to client work

The same structure adapts to business dashboard development: a typed field-to-chart mapping, browser-side spreadsheet parsing, and a layout canvas let a client preview dashboard ideas against their own data before committing to a production reporting stack. This page shows source code, not a live deployment; a hosted walkthrough can be arranged on request.

Problem

Business teams often need a dashboard or analytics application that turns operational data into usable KPI views, not just a disconnected spreadsheet export.

Context

The public repository Mavline/PowerBI_like is an LLM-assisted BI dashboard prototype from Excel data. Its README documents a client-side workflow: upload an Excel file, select sheets and columns, choose a chart type, and assemble visual elements on a dashboard canvas. This page links that public repository directly; there is no hosted demo, and no measured client result is claimed.

Inputs

Excel workbooks parsed in the browser
User-selected sheets, columns, and chart field mappings

Technical approach

The repository implements a client-side dashboard prototype. Excel files are parsed in the browser with the xlsx library, selected fields are mapped to chart roles such as x-axis, y-axis, category, and series, and dashboard items are placed on a canvas with drag-and-layout interactions. Dashboard and workbook state is held in a Zustand store, and chart components render the selected data. The repository ships source only; there is no public deployment.

Stack

React, TypeScript, Vite
Zustand state store
Chart.js, react-chartjs-2, Nivo treemap
dnd-kit drag-and-layout
xlsx spreadsheet parsing
html-to-image / html2canvas export helpers

What was built

A client-side BI dashboard prototype: Excel upload, sheet and column selection, chart-type selection, a draggable dashboard canvas, and per-item chart configuration (bar, line, column, stacked, pie, donut, treemap, and table). The repository structure shows dedicated components for file upload, sheet and column selection, chart-type selection, and the dashboard canvas, plus a typed Zustand store for dashboard state.

Deployment

No hosted demo. The public repository ships source and a local run path (npm install, npm run dev).

What can be reused

Typed chart-field mapping (x-axis, y-axis, category, series)
Browser-side Excel parsing into chart-ready data
Draggable dashboard canvas with per-item chart state

Boundaries

Source code only; there is no deployed public app
No client metrics, private datasets, or Power BI files are exposed
Private dashboard candidates (Power BI-style prototypes) remain sanitized and unlinked