Back to examples Browser App

Data Visualization

A browser-only workspace for pasting CSV data, previewing fields, and producing SVG visual summaries.

Show how UIF can support local data workflows without requiring a server upload.
Local Browser Data Studio

Visualization Workspace

Rows0
Total0
Average0
Maximum0

Micro App Contract

This example is a contained UIF Micro App: route-scoped assets, browser-side state, visible controls, and a bounded root that can run inside the larger public shell.

Pattern Purpose

Use this pattern when users need to explore lightweight tabular data in the browser before committing it to a governed workflow.

Recommended Structure

Provide data entry, field detection, chart controls, summary metrics, and export-ready visual output inside one contained workspace.

What Users Can Try

  • Paste or upload CSV without server upload.
  • Infer schema and numeric fields client-side.
  • Render multiple SVG chart types.
  • Export chart SVG and project JSON.
Sample Markup
<section data-uif-demo="data-visualization">
  <textarea data-uif-csv-input></textarea>
  <select data-uif-chart-type>...</select>
  <svg data-uif-chart></svg>
</section>