BI Analytics Dashboard Prototype

A source-backed proof page for BI and dashboard application work: chart surfaces, dashboard structure, and analytics UI patterns, shown without claiming a public deployment.

View source repository

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

This proof page links a verified public repository, Mavline/PowerBI_like, as repository-code proof 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 is a code boundary, not a live deployment claim; a hosted walkthrough can be arranged on request.

Proof assets and links

repo-code-proof: public repository Mavline/PowerBI_like, README documents the Excel-to-dashboard workflow and stack
repo-code-proof: src/store/dashboardStore.ts defines the typed ChartType, ChartFields, and DashboardItem model
repo-code-proof: src/components includes FileUpload, SheetSelector, ColumnSelector, ChartTypeSelector, and DashboardCanvas

Repository or technical proof boundary. Portfolio proof, not measured client metrics.

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 source is the public repository Mavline/PowerBI_like, described as 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 as repository-code proof; no public deployment or 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 proof boundary is repository-code only because the repository ships 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

Repository-code proof only. The public repository ships source and a local run path (npm install, npm run dev); no hosted demo URL is claimed.

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

Repository-code proof, not a deployed public app claim
No client metrics, private datasets, or Power BI files are exposed
Private dashboard candidates (Power BI-style prototypes) remain sanitized and unlinked