A lightweight, browser-native semantic engine that feeds live Google Form responses or CSV files directly into an interactive 2D cluster map.
It leverages Gemini Vector Embeddings for contextual text analysis and offloads high-dimensional spacing to a web worker running UMAP-js, providing real-time, zero-backend projection modeling.
- Live Google Sheets Integration – Dynamically polls data directly from public Google Sheets (ideal for workshop streams or interactive surveys).
- Zero-Backend Architecture – Built entirely in vanilla ES6+ JavaScript, offloading heavy math to client-side threads via HTML5 Web Workers.
- Dual Embedding Modes – Use production-grade
gemini-embedding-2vectors or toggle local deterministic mathematical vector generation for rapid offline preview testing. - Dynamic Custom Column Mapping – In-app routing control panel allows you to dynamically assign properties for semantic parsing, categorical coloring, text filtering, and time-series modeling.
- Integrated Multi-State Timeline – Includes built-in timeline playback (slide window or cumulative accretion animations) for processing temporal structural shifts.
- Comprehensive Client Caching – Uses browser IndexedDB instances to store historical hashes, ensuring minimal network overhead and fast re-renders on incremental data refreshes.
- D3.js (v7) – Visualizes projection states using HTML5 Canvas rendering for optimized processing of large node sets, backed by SVG spatial mapping and quadtrees for sub-millisecond cursor lookup and bounding-box selections.
- UMAP-js (v1.4.0) – Uniform Manifold Approximation and Projection engine executed in an asynchronous background thread.
- Lucide Icons – Crisp, modern iconography framework.
Access the ready-to-use live app directly at: 👉 mynkpdr.github.io/umaps/liveumap.html
Since this app is a fully self-contained static HTML single-page asset, you can save and execute it directly from your terminal workspace:
# Clone the repository asset
git clone https://github.com/mynkpdr/umaps.git
cd umaps
# Fire up a quick local development server
python3 -m http.server 8000
Open http://localhost:8000/liveumap.html in your browser.
- Click the Key Icon in the header to safe-store your Gemini API Key directly in your browser's local sandbox partition (
localStorage). No keys are ever written to or transmitted through structural backend servers. - Alternatively, toggle the "Local preview vectors" checkbox to run the application fully offline utilizing automated lexical hashing.
- To connect a live response stream, open a Google Sheet, navigate to
File > Share > Publish to web, and choose Comma-separated values (.csv). Paste that URL directly into the app's Source Settings dashboard.